setTimeout() - отложенный запуск функции в JavaScript

setTimeout() нужен, чтобы запустить функцию позже, через указанное количество миллисекунд. Это один из базовых инструментов для работы с таймерами в JavaScript.

Главная идея простая: вы передаёте функцию и задержку, а JavaScript выполняет эту функцию не сразу, а спустя некоторое время.

Синтаксис

Базовая запись выглядит так:

setTimeout(callback, delay, arg1, arg2, ...)

Где:

callback - функция, которую нужно выполнить позже
delay - задержка в миллисекундах
arg1, arg2, ... - дополнительные аргументы, которые будут переданы в callback

Обычно setTimeout() используют так:

setTimeout(() => {
  console.log("Готово");
}, 1000);

Что возвращает `setTimeout()`

setTimeout() возвращает идентификатор таймера.

Этот идентификатор нужен, если вы захотите отменить запланированный вызов через clearTimeout().

const timerId = setTimeout(() => {
  console.log("Этот код выполнится позже");
}, 1000);

console.log(timerId);

В браузере это обычно числовой идентификатор. В Node.js возвращается объект таймера. В обоих случаях результат можно передать в clearTimeout().

Простой пример

setTimeout(() => {
  console.log("Прошла 1 секунда");
}, 1000);

Сначала код просто поставит задачу в очередь, а сообщение появится позже.

`setTimeout()` не выполняет функцию сразу

Это основное поведение метода.

console.log("start");

setTimeout(() => {
  console.log("timeout");
}, 0);

console.log("end");

Результат будет таким:

start
end
timeout

Даже если задержка равна 0, колбэк всё равно не выполнится в ту же строку.

Задержка указывается в миллисекундах

Это важно не перепутать.

setTimeout(() => {
  console.log("500 мс прошло");
}, 500);

Здесь 500 означает половину секунды, а не 500 секунд.

`setTimeout()` выполняет функцию не раньше указанной задержки

Это полезно понимать точно.

Задержка в setTimeout() означает минимальное время ожидания, а не обещание выполнить код ровно в ту же миллисекунду.

const start = Date.now();

setTimeout(() => {
  console.log(Date.now() - start >= 20); // true
}, 20);

То есть колбэк выполнится не раньше нужного времени, но в реальности может сработать немного позже.

Дополнительные аргументы можно передавать прямо в `setTimeout()`

Это удобный, но не всегда известный нюанс.

setTimeout((a, b) => {
  console.log(a + b); // 5
}, 1000, 2, 3);

Здесь числа 2 и 3 будут переданы в функцию после задержки.

`clearTimeout()` отменяет таймер

Это одна из самых частых практических задач.

const timerId = setTimeout(() => {
  console.log("Не должно выполниться");
}, 1000);

clearTimeout(timerId);

Если отменить таймер до его срабатывания, колбэк не запустится.

`setTimeout()` не ставит весь код на паузу

Это очень важный момент.

setTimeout() только планирует выполнение функции на будущее. Остальной код продолжает работать сразу.

console.log("A");

setTimeout(() => {
  console.log("B");
}, 1000);

console.log("C");

Результат будет таким:

A
C
B

То есть программа не «ждёт» внутри setTimeout().

`setTimeout()` выполняет функцию только один раз

Это важно не путать с setInterval().

setTimeout(() => {
  console.log("Один раз");
}, 1000);

После одного запуска таймер заканчивает работу.

Если нужен повторяющийся вызов, для этого обычно используют setInterval().

Когда это полезно

setTimeout() особенно удобен, когда:

нужно запустить код позже
нужно показать сообщение через небольшую задержку
нужно отложить действие после клика или ввода
нужно сделать простой таймаут
нужно отменяемое действие через clearTimeout()

Пример:

const timerId = setTimeout(() => {
  console.log("Пользователь ничего не делал слишком долго");
}, 5000);

Такой подход часто используют для подсказок, уведомлений, отложенной валидации и простых таймеров ожидания.

Частые ошибки

Вызывать функцию сразу вместо передачи функции

setTimeout(console.log("Привет"), 1000);

Здесь console.log("Привет") выполнится немедленно, а в setTimeout() попадёт уже результат вызова, а не функция.

Правильно так:

setTimeout(() => {
  console.log("Привет");
}, 1000);

Думать, что `0` означает мгновенное выполнение

console.log("start");

setTimeout(() => {
  console.log("timeout");
}, 0);

console.log("end");

Сначала всё равно выполнится синхронный код, и только потом сработает таймер.

Ожидать, что задержка будет абсолютно точной

setTimeout(() => {
  console.log("run");
}, 100);

setTimeout() гарантирует не точный момент запуска, а то, что функция выполнится не раньше указанного времени.

Забывать сохранять идентификатор, если таймер нужно отменить

setTimeout(() => {
  console.log("run");
}, 1000);

Если позже понадобится отмена, без сохранённого идентификатора это сделать уже неудобно.

Лучше так:

const timerId = setTimeout(() => {
  console.log("run");
}, 1000);

clearTimeout(timerId);

Путать `setTimeout()` и `setInterval()`

setTimeout(() => {
  console.log("Один раз");
}, 1000);

setTimeout() запускает код один раз, а не повторяет его по кругу.

Быстрая памятка

setTimeout() откладывает выполнение функции
задержка указывается в миллисекундах
метод возвращает идентификатор таймера
этот идентификатор можно передать в clearTimeout()
0 не означает мгновенный запуск
колбэк выполнится не раньше указанной задержки
дополнительные аргументы можно передавать прямо в setTimeout()
setTimeout() не останавливает выполнение остального кода
таймер срабатывает один раз

Коротко

setTimeout() в JavaScript нужен, чтобы выполнить функцию позже, через заданную задержку. Главное, что стоит запомнить: время задаётся в миллисекундах, колбэк не запускается мгновенно даже при 0, метод возвращает идентификатор таймера для clearTimeout(), не ставит весь код на паузу и выполняет переданную функцию только один раз.

setTimeout() - отложенный запуск функции в JavaScript

Синтаксис

Что возвращает setTimeout()

Простой пример

setTimeout() не выполняет функцию сразу