자바스크립트 타이머함수

자바스크립트에서는 크게 두가지 타이머 함수가 존재한다.

 

 

🐬 setTimeout() : 일정 시간 뒤에 함수가 실행

🐬 setInterval() : 일정시간마다 함수가 실행

 

 

 

중요한점은 두 타이머는 정확한 시간을 보장하지는 않는다! 예를들어 400ms를 준다고 해당 시간을 정확하게 보장하지는 않는다는 것이다.

 

 

setTimeout() 함수가 실행되면 바로 실행되는것이 아닌, 큐에 넣어 대기하게 된다. JS 블록의 실행이 끝나지 않았기 때문에 처리를 할 수 없기 때문이다.

 

 

JS 블록이 끝나면 큐 내부에서 대기하는 처리가 있는지 확인한다. 여기에는 자바스크립트 코드뿐 아니라 마우스클릭등의 이벤트또한 존재할 수 있다.

 

 

결국 setTimeout() 함수는 필연적으로 이전의 콜백 실행으로부터 지연되는 시간을 갖게 된다.

 

 

그렇다면 setInterval()은 어떨까?? setTimeOut()함수와는 달리, 이전 콜백 이후부터 시간을 재기 때문에 더 정확한 타이머를 가질 수 있다.