Расскажите про Event Loop: call stack, микротаски, макротаски.

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

• Call Stack — стек вызовов, где хранятся выполняющиеся функции. Когда функция вызывается, она помещается в стек, когда завершается — удаляется.

• Макротаски (Macrotasks) — это задачи, которые ставятся в очередь событий (event queue). Примеры: setTimeout, setInterval, I/O операции, события DOM.

• Микротаски (Microtasks) — задачи, которые выполняются сразу после текущей операции и перед следующей макротаской. Примеры: промисы (Promise.then/catch/finally), process.nextTick (в Node.js).

Как работает Event Loop:

1. Выполняется весь код из call stack.
2. После опустошения call stack выполняются все микротаски из микротаск-очереди.
3. Затем берётся одна макротаска из очереди макротасков и помещается в call stack для выполнения.
4. Повторяется цикл.

Это гарантирует, что микротаски выполняются раньше, чем макротаски, что важно для последовательности асинхронных операций.

Пример:

console.log('start');
setTimeout(() => console.log('timeout'), 0);
Promise.resolve().then(() => console.log('promise'));
console.log('end');
// Вывод будет:
// start
// end
// promise
// timeout