> Как обрабатываются call stack и очереди в JavaScript (JavaScript)

Уровень: senior · Роль: frontend · Категория: Технические вопросы

Компании: циан, Spotware

Стек: JavaScript

> Пример ответа

В JavaScript выполнение кода управляется циклом событий (Event Loop), который координирует работу call stack (стека вызовов) и очередей (очереди микрозадач и макрозадач).

Call stack - это структура данных LIFO (последним пришёл - первым ушёл). Когда вызывается функция, её контекст помещается на стек. Когда функция завершается, контекст снимается. Если стек переполняется (например, из-за бесконечной рекурсии), возникает ошибка Maximum call stack size exceeded.

Очереди работают по принципу FIFO (первым пришёл - первым ушёл). В JavaScript есть две очереди:

  • Очередь макрозадач (macrotask queue): сюда попадают setTimeout, setInterval, события DOM, fetch и т.д.

  • Очередь микрозадач (microtask queue): сюда попадают Promise.then/catch/finally, queueMicrotask, MutationObserver.

Порядок обработки:

  1. Выполняется синхронный код из call stack до его опустошения.

  2. Затем обрабатывается вся очередь микрозадач (одна за другой, пока она не станет пустой).

  3. После этого берётся одна макрозадача из очереди макрозадач.

  4. Цикл повторяется.

Пример:

JAVASCRIPT
console.log('1'); // синхронно, сразу в стек
setTimeout(() => console.log('2'), 0); // макрозадача
Promise.resolve().then(() => console.log('3')); // микрозадача
console.log('4'); // синхронно

Вывод: 1, 4, 3, 2. Сначала выполняется весь синхронный код (1 и 4), затем микрозадача (3), и только потом макрозадача (2). Это гарантирует, что промисы обрабатываются раньше таймеров, даже если таймер имеет нулевую задержку.

> ГОТОВЫ К СЛЕДУЮЩЕМУ СОБЕСЕДОВАНИЮ?

Запустите тренировочную сессию с ИИ и получите детальную обратную связь, чтобы увереннее проходить реальные интервью