setTimeout callback в JavaScript

• Что такое setTimeout callback
• Синтаксис
• Именованная функция
• Анонимная функция
• Стрелочная функция
• Передача аргументов
• Почему функцию передают без скобок
• setTimeout не останавливает код
• Итого

setTimeout() принимает callback-функцию и вызывает ее через заданное время.

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

Первый аргумент - функция, которую нужно выполнить позже.

Второй аргумент - задержка в миллисекундах. 1000 миллисекунд равны одной секунде.

Что такое setTimeout callback

Callback в setTimeout() - это функция, которую мы не вызываем сами.

Мы передаем ее в setTimeout(), а браузер вызывает ее после задержки.

function showMessage() {
  console.log('Готово');
}

setTimeout(showMessage, 2000);

Функция showMessage() выполнится примерно через 2 секунды.

Синтаксис

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

setTimeout(callback, delay);

callback - функция, которую нужно выполнить позже.

delay - задержка в миллисекундах.

setTimeout(function () {
  console.log('Привет!');
}, 3000);

Этот callback выполнится примерно через 3 секунды.

Именованная функция

В setTimeout() можно передать уже объявленную функцию.

function sendMessage() {
  console.log('Сообщение отправлено');
}

setTimeout(sendMessage, 1000);

Обратите внимание: мы пишем sendMessage, а не sendMessage().

Так мы передаем функцию, а не результат ее вызова.

Анонимная функция

Если функция нужна только для этого таймера, ее можно написать прямо внутри setTimeout().

setTimeout(function () {
  console.log('Показать уведомление');
}, 1500);

Такая функция не имеет имени и вызывается только таймером.

Стрелочная функция

Часто callback для setTimeout() записывают стрелочной функцией.

setTimeout(() => {
  console.log('Данные загружены');
}, 1000);

Для короткого действия можно записать еще компактнее.

setTimeout(() => console.log('Готово'), 1000);

Передача аргументов

Если callback-функции нужны аргументы, их можно передать после задержки.

function greetUser(name) {
  console.log('Привет, ' + name + '!');
}

setTimeout(greetUser, 1000, 'Анна');

Результат через 1 секунду:

Привет, Анна!

Значение ‘Анна’ попадет в параметр name.

Можно сделать и через стрелочную функцию.

setTimeout(() => {
  greetUser('Игорь');
}, 1000);

Такой вариант часто удобнее, если внутри нужно выполнить несколько действий.

Почему функцию передают без скобок

Самая частая ошибка с setTimeout() - вызвать функцию сразу.

function showMessage() {
  console.log('Привет!');
}

setTimeout(showMessage(), 1000);

В этом примере функция showMessage() выполнится сразу, а не через секунду.

Правильный вариант:

setTimeout(showMessage, 1000);

Когда мы пишем имя функции без скобок, мы передаем саму функцию как callback.

setTimeout не останавливает код

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

setTimeout(() => {
  console.log('Второе сообщение');
}, 1000);

console.log('Первое сообщение');

Результат:

Первое сообщение
Второе сообщение

JavaScript запускает таймер и сразу продолжает выполнять следующий код.

Итого

1. Callback в setTimeout() - это функция, которая выполнится позже.

2. Первым аргументом передают функцию, вторым - задержку в миллисекундах.

3. Именованную функцию передают без скобок: setTimeout(showMessage, 1000).

4. Если написать showMessage(), функция вызовется сразу.

5. setTimeout() не останавливает код, а только планирует выполнение callback-функции.