PassFront
  1. PassFront
  2. База знаний
  3. Асинхронность и Event Loop

Как работает setInterval?

Асинхронность и Event Loop

`setInterval` — функция, которая многократно вызывает коллбэк с заданным интервалом в миллисекундах, пока её не остановят.

Синтаксис

const id = setInterval(callback, delay, arg1, arg2);
clearInterval(id); // остановить
let count = 0;
const id = setInterval(() => {
  console.log(++count);
  if (count === 5) clearInterval(id);
}, 1000);

Особенности и подводные камни

  • Интервал — это макрозадача; если стек занят, вызовы задерживаются и могут «наслаиваться».
  • Реальный интервал не гарантирован: при тяжёлом коде вызовы сдвигаются, а пропущенные тики браузер не копит и потом пачкой не выполняет.
  • Не останавливается сам — обязательно clearInterval, иначе утечка (особенно при размонтировании компонента).

setInterval против рекурсивного setTimeout

Для точности часто предпочитают «рекурсивный setTimeout»: он планирует следующий вызов только после завершения текущего, гарантируя паузу между итерациями.

function tick() {
  // работа
  setTimeout(tick, 1000); // пауза именно 1с между запусками
}
setTimeout(tick, 1000);

В React

Интервал ставят в useEffect и очищают в функции очистки, чтобы избежать утечек.

Коротко для собеседования

setInterval повторяет коллбэк каждые delay мс (макрозадача) до clearInterval. При тяжёлом коде вызовы задерживаются/наслаиваются; для точной паузы между итерациями используют рекурсивный setTimeout. Всегда очищают интервал.

Другие вопросы раздела