Как поставить микрозадачу в очередь?
Асинхронность и Event Loop
Микрозадачу в очередь ставят через `queueMicrotask(callback)`, `Promise.resolve().then(callback)` или `await`. Все они добавляют задачу в очередь микрозадач.
queueMicrotask (прямой способ)
queueMicrotask(() => {
console.log('микрозадача');
});Явно ставит функцию в очередь микрозадач.
Promise.resolve().then()
Promise.resolve().then(() => {
console.log('микрозадача через промис');
});Коллбэк then — микрозадача.
await (в async-функции)
async function fn() {
await null; // продолжение после await — микрозадача
console.log('после await');
}Порядок выполнения
Микрозадачи выполняются после синхронного кода и раньше макрозадач (setTimeout):
console.log('1'); // sync
setTimeout(() => console.log('4'), 0); // macro
queueMicrotask(() => console.log('3')); // micro
Promise.resolve().then(() => console.log('3.5')); // micro
console.log('2'); // sync
// 1, 2, 3, 3.5, 4queueMicrotask vs Promise
- queueMicrotask — семантически чище для «просто поставить микрозадачу».
- Promise.resolve().then — то же, но через промис.
Осторожно
Бесконечная генерация микрозадач блокирует рендер и макрозадачи:
function loop() { queueMicrotask(loop); } // зависнетКоротко для собеседования
Микрозадачу ставят: queueMicrotask(callback) (прямой, чистый способ), Promise.resolve().then(callback) (коллбэк — микрозадача), await (продолжение — микрозадача). Микрозадачи выполняются после синхронного кода и раньше макрозадач (setTimeout). Бесконечная генерация микрозадач блокирует рендер.