Как определить порядок вывода console.log в асинхронном коде?

Question

Чтобы определить порядок вывода console.log, нужно понимать работу event loop. Сначала всегда выполняется синхронный код из call stack. Затем выполняются все микрозадачи (например, then, catch, finally). Только после этого обрабатываются макрозадачи (setTimeout, setInterval, события). Зная, к какой очереди относится операция, можно точно предсказать порядок логов.

YeaHub · Accepted Answer

Порядок выполнения в JavaScript не случайный — он строго регламентирован моделью event loop.ОпределениеОпределение: Event loop — механизм, который управляет очередями задач и определяет, какой код и когда будет выполнен.Основные участникиПеред анализом любого примера полезно помнить три уровня выполнения:Call stackвесь синхронный кодMicrotask queuePromise.thenPromise.catchPromise.finallyqueueMicrotaskMacrotask queuesetTimeoutsetIntervalсобытияsetImmediate (в Node.js)Алгоритм определения порядкаЧтобы определить порядок console.log, действуй по шагам:Выпиши весь синхронный код — он выполнится первым.Найди микрозадачи и запомни порядок их постановки.Найди макрозадачи.После завершения синхронного кода:сначала выполняются все микрозадачи,потом одна макрозадача,затем снова микрозадачи и так далее.Пример с разборомconsole.log('A');

setTimeout(() => {
  console.log('B');
}, 0);

Promise.resolve().then(() => {
  console.log('C');
});

console.log('D');
Разбор:Синхронно:ADМикрозадачи:CМакрозадачи:BИтоговый вывод:A
D
C
B
Частые ловушкиsetTimeout(fn, 0) не означает “выполнить сразу”микрозадачи могут “задушить” макрозадачи, если их слишком многоasync/await внутри себя тоже использует промисы и микрозадачиВывод: чтобы определить порядок вывода логов, нужно строго разделять синхронный код, микрозадачи и макрозадачи и применять правила event loop шаг за шагом.