宏任务(macrotask)与微任务(microtask)是JavaScript中的两种任务队列,它们的区别在于执行的优先级。
宏任务:
- setTimeout
- setInterval
- setImmediate (Node.js 环境中)
- I/O
- UI rendering
- requestAnimationFrame
微任务:
- process.nextTick (Node.js 环境中)
- Promises
- Object.observe (已废弃)
- MutationObserver
当JavaScript运行时,会维护一个执行栈(Execution Stack)和任务队列。当执行栈为空时,引擎会先处理所有微任务,然后再处理宏任务。
示例代码:
console.log('script start');
setTimeout(function() {
console.log('setTimeout');
}, 0);
Promise.resolve().then(function() {
console.log('Promise1');
}).then(function() {
console.log('Promise2');
});
console.log('script end');
// 输出顺序为:
// script start
// script end
// Promise1
// Promise2
// setTimeout
在这个例子中,setTimeout
是一个宏任务,而 Promise
的回调是微任务。当执行到 setTimeout
时,其回调会被推入宏任务队列,而 Promise
的回调会被推入微任务队列。在本轮事件循环结束时,浏览器会先执行所有微任务,再执行宏任务。因此,输出顺序是先 "script start", "script end", "Promise1", "Promise2", 最后 "setTimeout"。