По умолчанию, весь код в JavaScript работает синхронно. Это значит, что команды выполняются сверху вниз, одна за другой.

console.log('hello');
console.log('synchronous');
console.log('world');

Строки появятся на экране в том же порядке, как они написаны.

hello
synchronous
world

Запуск таймера с помощью setTimeout

Чтобы отложить выполнение какой-то части кода, в JS существует функция setTimeout. В базовом случае она принимает два параметра:

  • callback - функция которую нужно вызывать
  • delay - задержка в миллисекундах

setTimeout установит таймер и вызовет функцию callback через delay миллисекунд.

console.log('hello');
setTimeout(() => {
  console.log('асинхронное сообщение, которое появится на экране через 1 секунду')
}, 1000);
console.log('world');

Сообщения появятся в таком порядке:

hello
world
асинхронное сообщение, которое появится на экране через 1 секунду

Ошибки использования setTimeout

В setTimeout первым параметром нужно обязательно передать функцию. Если написать просто console.log - работать не будет.

console.log('hello');
setTimeout(console.log('failed async message'), 1000);
console.log('world');

Это неправильный пример. Вывод сообщения failed async message не будет отложен, потому что console.log запустится синхронно и вернет undefined.

В итоге может получится два варианта. Они зависят от того, где запускается код:

  • Node.js - ошибка

    TypeError [ERR_INVALID_CALLBACK]: Callback must be a function

  • Браузер — ошибки не будет, и сообщения выведутся по порядку

    hello
failed async message
world