[Javascript] setInterval 바로 실행하기

setInterval 함수는 인자로 받은 함수를 특정시간마다 실행시키는 함수이다.

즉시 실행되지 않고 먼저 기다린 뒤 특정 시간 간격으로 실행된다.

 

setInterval(console.log("hello world"), 10000); // 1000 = 1초

// 10초 뒤 hello world 출력
// 20초 뒤 hello world 출력
// 30초 뒤 hello world 출력
// ...

 

하지만, 먼저 실행을 시키고 일정간격으로 동작시키고 싶을 때가 있다!

그럴땐 아래처럼 코드를 두 줄로 써도 가능하지만, 실행하는 함수가 중복이 된다.

아래 코드의 경우 console.log("hello world")가 중복이다.

console.log("hello world")
setInterval(console.log("hello world"), 10000);

// hello world 출력
// 10초 뒤 hello world 출력
// 20초 뒤 hello world 출력
// 30초 뒤 hello world 출력
// ...

 

해결방법

// util.js
export const startInterval = (seconds, callback) => {
  callback();
  return setInterval(callback, seconds * 1000);
};

// index.js
startInterval(10, function () {
  console.log("hello world");
});

startInterval이라는 함수를 만들어서 초와 콜백함수를 받도록 하고, 내부에서는 전달받은 콜백을 수행 후, setInterval을 수행해준다.

startInterval 함수에 초와 실행시킬 함수를 넣어준다!

 

참고: https://itmining.tistory.com/70