[JavaScript] setTimeout과 setInterval 차이

JavaScript에서 일정 시간이 지난 뒤 코드를 실행하거나, 지속적으로 반복 실행하고 싶을 때 setTimeout과 setInterval을 사용한다.
두 함수는 비슷해 보이지만 동작 방식은 분명한 차이가 있다.

 

---

 

✔ setTimeout

일정 시간이 지난 후 딱 1번 실행

 

setTimeout(() => { console.log("3초 후 실행됨"); }, 3000);

• 일정 시간이 지나면 한 번만 실행됨
• 작업을 지연시키거나, 특정 시점에 한 번 실행하는 용도

 

✔ setInterval

일정 간격으로 계속 반복 실행

setInterval(() => { console.log("1초마다 실행됨"); }, 1000);

• 일정한 간격으로 계속 실행
• 시계, 타이머, 주기적 업데이트처럼 반복 작업에 적합

 

 

---

 

 

 

 

 

공통점

둘 다 “ID(식별자)”를 반환함
둘 다 실행하면 타이머 ID가 반환되고 이를 이용해서 취소할 수 있다.

clearTimeout()

const timer = setTimeout(() => {}, 1000); clearTimeout(timer);

clearInterval()

const timer = setInterval(() => {}, 1000); clearInterval(timer);

 

불필요해진 타이머는 꼭 취소하는 것이 메모리 관리에 좋다.

 

 

setInterval의 시간 지연은 정확하지 않을 수 있다

setInterval은 지정한 시간 간격 + 함수를 실행하는 데 걸린 시간을 포함해서 다음 실행을 예약합니다.

 

setInterval은 콜백이 계속 메모리에 남아 있다

setInterval은 clearInterval을 호출하기 전까지
콜백 함수를 계속 보관하기 때문에
불필요해지면 꼭 중단해줘야 메모리 누수 위험이 없다.

---

정리

기능	setTimeout	setInterval
실행 횟수	한 번	반복
취소	clearTimeout	clearInterval
시간 정확성	문제 없음	지연 누적 가능
메모리	한 번 실행 뒤 제거	중단하지 않으면 계속 유지