[ Javascript ] setTimeout, setInterval

setTimeout()

setTimeout() 메서드는 만료된 후 함수나 지정한 코드 조각을 실행하는 타이머를 설정한다.

어떤 코드를 바로 실행하지 않고 일정 시간 기다린 후 실행해야하는 경우가 존재한다. 이러한 경우 setTimeout 함수를 사용하여 첫 번째 인자로 받은 실행할 코드를 두번째 인자로 받은 delay time 후에 실행한다. 

delay time은 밀리초(ms) 단위이다. 

var timeoutID = setTimeout( function [, delaty, arg1, arg2, ... ] );
var timeoutID = setTimeout( function [, delay]);
var timeoutID = setTimeout( code [, delay ]);

 

매개변수

function

지정된 delay 시간이 지난 후 실행할 function을 의미한다.

 

code 

함수 대신 문자열을 지정하는 대체 구문으로, 타이머가 만료될 때 코드로 컴파일 후 실행한다. ➡️ 사용을 별로 권장하지 않음.

 

delay  ( optional )

주어진 함수 또는 코드를 실행하기 전에 기다릴 시간이다. 생략하거나 0으로 지정할 경우 "즉시" 실행한다는 뜻이다.

 

arg1, ... , argN

function에 전달할 추가 매개변수이다.

 

반환값

timeoutID는 양의 정수로 setTimeout()이 생성한 타이머를 식별할 때 사용한다. 해당 값을 clearTimeout()에 전달하면 타이머를 취소할 수 있다.

 

---

setInterval()

setInterval() 메서드는 주기적으로 발생해야 하는 부분이 있을 때 사용한다. 예를 들어 어떤 API로부터 변경된 데이터를 주기적으로 받아온다던가, 특정 부분을 주기적으로 업데이트를 해줘야 하다던가 할때 사용할 수 있다.

setInterval() 메서드는 해당 객체 ID를 반환하므로 setTimeout() 메서드의 clearTimeout()과 같이 clearInterval() 함수를 호출하여 제거할 수 있다. 

 

setInterval() 함수는 어떤 코드를 일정한 시간 간격을 두고 반복해서 실행하고 싶을 때 사용한다. 첫 번째 인자로 실행할 코드를 담고, 두 번째 인자로 반복 주기 시간을 밀리초(ms)단위로 받는다.

 

매개변수, 반환값은 setTimeout과 거의 동일하다.