Цикл событий в JavaScript (в контексте веб-браузера) — это механизм, позволяющий выполнять асинхронные операции без блокировки основного потока выполнения. Он состоит из нескольких компонентов:
- Куча (Heap): Область памяти, где хранятся объекты.
- Стек вызовов (Call Stack): Структура данных LIFO, отслеживающая выполнение синхронных функций.
- Веб-API (Web APIs): Предоставляются браузером (DOM, AJAX,
setTimeout, setInterval, Event Listeners и т.д.). Они не являются частью движка JavaScript.
- Очередь обратного вызова (Callback Queue) / Очередь задач (Task Queue): Очередь сообщений для выполнения асинхронных задач.
- Очередь микрозадач (Microtask Queue): Приоритетная очередь для микрозадач (
Promise.then(), async/await, queueMicrotask). Выполняется до очереди задач.
- Цикл событий (Event Loop): Непрерывно проверяет стек вызовов и очереди. Если стек пуст, он перемещает первый обработчик из очереди микрозадач (если есть) в стек. После опустошения очереди микрозадач, перемещает первый обработчик из очереди задач в стек.
Процесс выглядит так:
- Выполняется синхронный код и функции помещаются в стек вызовов.
- Когда встречается асинхронная операция (например,
setTimeout), она передается соответствующему веб-API. Выполнение синхронного кода продолжается.
- Веб-API выполняет операцию в фоновом режиме.
- После завершения асинхронной операции, обработчик (callback) этой операции помещается в очередь задач (для обычных async ops) или очередь микрозадач (для промисов).
- Цикл событий постоянно проверяет стек вызовов. Если стек пуст:
- Он проверяет очередь микрозадач. Если есть обработчики, он перемещает их в стек вызовов для исполнения, пока очередь микрозадач не станет пустой.
- Затем он проверяет очередь задач. Если есть обработчики, он перемещает первый обработчик из очереди задач в стек вызовов для исполнения.
- Этот процесс повторяется, позволяя выполнять асинхронные операции без блокировки основного потока.
Пример с setTimeout:
javascript
Пример с промисами:
javascript
Порядок выполнения: синхронный код ('A', 'C'), затем опустошается очередь микрозадач ('B'), затем очередь задач.