Урок 65 из 114 · 8 мин

Цикл событий и память

Цикл событий, очередь задач и микрозадач, порядок выполнения промисов и таймеров, сборка мусора.

Кто первый

Вредный Скрипт
Угадайте порядок: таймер 0 мс, промис и обычный console.log!
Бро
Легко: сначала весь текущий код, потом все микрозадачи, потом следующая задача. Сейчас покажу.

Понятие

Цикл событий

Что это: Движок выполняет одну задачу целиком (скрипт, обработчик клика, колбэк таймера), затем все микрозадачи, затем отрисовка и следующая задача.
Зачем: Понять, почему долгий код замораживает страницу.
Как: JavaScript
setTimeout(() => console.log("3: таймер"), 0); Promise.resolve().then(() => console.log("2: промис")); console.log("1: код");
Так это работает

Понятие

Микрозадачи

Что это: Колбэки then, await и queueMicrotask идут в очередь микрозадач — она опустошается сразу после текущей задачи, раньше таймеров.
Зачем: Порядок промисов и таймеров.
Как: JavaScript
queueMicrotask(() => console.log("микрозадача")); setTimeout(() => console.log("задача")); console.log("синхронно");
Так это работает

Понятие

Сборка мусора

Что это: Объект, до которого больше нельзя добраться по ссылкам, движок удаляет. Утечка — когда ненужное всё ещё достижимо (забытый обработчик, растущий массив).
Зачем: Не держать лишнего: снимать обработчики, чистить кэши.

Ника
Тяжёлый синхронный код блокирует всё: и клики, и отрисовку. Делить работу — через задачи.

Ваш ход

Задание

Заполни массив order так, как реально выполнится код ниже: для этого просто добавь order.push(...) в каждый колбэк вместо комментариев и запусти.

const order = [];
setTimeout(() => { /* "timeout" */ }, 0);
Promise.resolve().then(() => { /* "promise" */ });
/* "sync" */

const order = [];
setTimeout(() => { /* "timeout" */ }, 0);
Promise.resolve().then(() => { /* "promise" */ });
/* "sync" */

Результат обновляется при вводе

ПрактикаОбязательное задание

Выберите один ответ.

Что выполнится раньше: then уже выполненного промиса или setTimeout(fn, 0)?

Домашнее заданиеДля закрепления

Выберите один ответ.

Когда объект удаляется сборщиком мусора?