3333

Question

Код выведет '1', '3', '2'. Сначала выполнится синхронный console.log('1'). Затем промис создаёт микрозадачу (microtask) для своего обработчика .then, но она выполнится только после завершения текущего макрозадания (macrotask). Следующий синхронный console.log('3') выполняется сразу. После этого Event Loop обрабатывает очередь микрозадач и выполняет console.log('2') из промиса.

YeaHub · Accepted Answer

Этот вопрос демонстрирует ключевой механизм работы асинхронного JavaScript — Event Loop и приоритетность выполнения задач. Понимание этого необходимо для предсказания порядка выполнения кода, особенно при работе с промисами, async/await и другими асинхронными операциями.Как работает Event LoopJavaScript имеет однопоточную модель выполнения, но использует Event Loop для обработки асинхронных операций без блокировки основного потока. Event Loop управляет двумя основными очередями: очередью задач (macrotask queue) и очередью микрозадач (microtask queue). К макрозадачам относятся, например, setTimeout, setInterval, I/O-операции. К микрозадачам — обработчики промисов (.then, .catch, .finally) и queueMicrotask.Порядок выполненияОсновное правило: после выполнения каждой макрозадачи Event Loop сначала полностью очищает всю очередь микрозадач, прежде чем взять следующую макрозадачу. Это обеспечивает высокий приоритет для промисов.Разбор примера кодаРассмотрим исходный код:console.log('1');

Promise.resolve()
  .then(() => console.log('2'));

console.log('3');Выполняется синхронный код: console.log('1') выводит '1'.Создаётся промис с помощью Promise.resolve(). Метод .then(() => console.log('2')) регистрирует колбэк в очереди микрозадач, но не выполняет его сразу.Выполняется следующий синхронный код: console.log('3') выводит '3'. На этом текущее макрозадание (изначальный скрипт) завершается.Event Loop переходит к фазе обработки микрозадач. Очередь микрозадач содержит колбэк из промиса. Он выполняется, и console.log('2') выводит '2'.Таким образом, порядок вывода: '1', '3', '2'.Практическое применениеПонимание этого порядка критично для:Отладки сложных асинхронных цепочек.Написания корректных тестов, которые зависят от порядка выполнения.Оптимизации производительности, чтобы не блокировать Event Loop длительными синхронными операциями между микрозадачами.Реализации паттернов, где нужно гарантировать выполнение кода после всех текущих промисов (например, с помощью queueMicrotask).Вывод: Этот пример наглядно показывает приоритет микрозадач (обработчиков промисов) над макрозадачами. Знание этого механизма помогает писать предсказуемый асинхронный код и является фундаментальным для любого JavaScript-разработчика.