Ты когда-нибудь задумывался?
Несмотря на то, что JavaScript является однопоточным, он обрабатывает асинхронные операции, такие как запрос API, setTimeOut. Вот тут-то и появляется цикл событий!

Примечание. Если вас интересует видеоверсия этой темы, посмотрите это прекрасное видео (2 минуты).

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

Когда JavaScript начинает интерпретировать этот код, первый main будет помещен в стек вызовов. Стек вызовов, в котором JavaScript отслеживает, какую функцию мы выполняем в данный момент, и какую функцию нужно выполнить после этого. Он записывает, в какой программе мы находимся. Главное — это общий контекст выполнения файла. После нажатия main будет отправлено console.log('hello'), затем оно запишет приветствие и выскочит.

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

Как только веб-API обработают запрос, он не будет передавать в стек вызовов выполнение кода внутри него. Так как в стеке могут выполняться другие операции. Чтобы решить эту проблему, в игру вступают очереди сообщений.

Веб-API помещают обработанный запрос в очередь сообщений. Очередь сообщений проверяет всякий раз, когда стек пуст, затем берет первое сообщение в очереди и помещает его в стек вызовов.

Вот почему, несмотря на то, что тайм-аут равен 0, он регистрирует JavaScript после завершения полного стека.

Весь этот процесс называется циклом событий.

Подводя итог, цикл событий обрабатывает асинхронные операции с помощью веб-API и очередей сообщений.