Расскажи про Event Loop: как он работает, что такое микрозадачи и макрозадачи?

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

Он работает так:

• Сначала выполняется весь синхронный код.
• Затем Event Loop проверяет очередь микрозадач (microtasks) и выполняет их по очереди.
• После этого выполняются макрозадачи (macrotasks) из соответствующей очереди.

Микрозадачи — это задачи с более высоким приоритетом, которые выполняются сразу после текущего синхронного кода и перед макрозадачами. Примеры микрозадач: промисы (Promise.then/catch/finally), MutationObserver.

Макрозадачи — это задачи с более низким приоритетом, которые выполняются после микрозадач. Примеры макрозадач: setTimeout, setInterval, I/O операции, события UI.

Пример:

console.log('start');
setTimeout(() => console.log('timeout'), 0);
Promise.resolve().then(() => console.log('promise'));
console.log('end');

Вывод будет:

start
end
promise
timeout

Потому что микрозадачи (promise) выполняются раньше макрозадач (setTimeout).