Как работает Event Loop в JavaScript

Event Loop — это механизм, который позволяет JavaScript выполнять асинхронные операции, несмотря на однопоточность.

1. Call Stack — выполняет синхронный код. Если встречается асинхронная операция (например, setTimeout, fetch), она передаётся в Web APIs.
2. Web APIs — обрабатывают асинхронные задачи (таймеры, HTTP-запросы). По завершении колбэки попадают в Callback Queue.
3. Callback Queue (Microtask & Macrotask) — очередь задач. Микрозадачи (Promise, queueMicrotask) выполняются перед макрозадачами (setTimeout, setInterval).
4. Event Loop — проверяет, пуст ли Call Stack. Если да, переносит задачи из очереди в стек для выполнения.

console.log('Start'); // 1. Синхронный код

setTimeout(() => console.log('Timeout'), 0); // 3. Макрозадача

Promise.resolve().then(() => console.log('Promise')); // 2. Микрозадача

console.log('End'); // 1. Синхронный код

Вывод:

Start  
End  
Promise  
Timeout