Что происходит с setInterval во время блокирующего alert?

В JavaScript, работающем в браузере, функции setInterval и setTimeout являются асинхронными и управляются механизмом Event Loop. Event Loop отвечает за выполнение кода, обработку событий и колбэков из очереди задач. Однако некоторые операции, такие как alert, confirm или prompt, являются синхронными и блокирующими.

Как работает блокировка

Когда вызывается alert('Сообщение'), браузер показывает модальное окно и полностью останавливает основной поток выполнения скрипта и Event Loop на текущей вкладке. Это означает, что никакой другой код, включая обработчики событий, анимации и колбэки таймеров, не может выполняться, пока пользователь не закроет окно.

Поведение setInterval

Таймер, созданный setInterval, продолжает "тикать" в фоновом режиме (в смысле внутреннего учёта времени). Каждый раз, когда проходит заданный интервал, соответствующая задача (вызов колбэка) должна быть поставлена в очередь макрозадач (task queue). Однако, поскольку Event Loop заблокирован, эти задачи не могут быть обработаны и накапливаются в ожидании.

Как только пользователь закрывает alert, Event Loop возобновляет работу. Все накопившиеся колбэки от setInterval (которые должны были выполниться за время блокировки) немедленно и последовательно извлекаются из очереди и выполняются. Между их выполнениями не будет выдержан исходный интервал — они выполнятся практически подряд.

Пример кода

let counter = 0;
const intervalId = setInterval(() => {
    console.log(`Интервал сработал: ${++counter}`);
}, 1000);

// Через 2.5 секунды запускаем блокирующий alert
setTimeout(() => {
    alert('Блокируем поток на 5 секунд (закройте окно)');
}, 2500);

// Остановим интервал через 10 секунд от начала
setTimeout(() => {
    clearInterval(intervalId);
    console.log('Интервал остановлен');
}, 10000);

В этом примере, если оставить окно alert открытым примерно на 5 секунд, то за время блокировки накопится около 5 колбэков (по одному в секунду). После закрытия alert в консоли сразу подряд появятся сообщения "Интервал сработал: 3", "Интервал сработал: 4" и так далее, без задержек в 1 секунду между ними.

Практическое значение

Это поведение важно учитывать при разработке интерактивных приложений, где точное время критично (например, таймеры, анимации, реальное время). Блокирующие вызовы, такие как alert, нарушают работу всех асинхронных процессов. В современных приложениях вместо alert следует использовать неблокирующие UI-компоненты (модальные окна, уведомления), которые не останавливают Event Loop.

Вывод: setInterval не выполняется во время блокирующего alert; его колбэки накапливаются в очереди и выполняются пачкой сразу после разблокировки потока, что ломает ожидаемую временную логику. Это наглядно демонстрирует однопоточную природу JavaScript в браузере и важность избегания блокирующих операций в основном потоке.