JavaScript是单线程语言,所有代码的执行都依赖事件循环机制来协调,异步任务的优先级调度本质就是事件循环对不同类型任务的处理顺序规则。掌握这套规则能让我们准确预判代码的执行结果,避免异步逻辑出现不符合预期的问题。

事件循环的基本运作逻辑
JavaScript的主线程会先执行同步代码,执行完所有同步代码后进入事件循环阶段。事件循环会先检查微任务队列,把当前微任务队列中的所有任务执行完毕,再去执行一个宏任务,执行完这个宏任务后再次检查微任务队列,如此循环往复。
宏任务与微任务的分类
异步任务主要分为宏任务和微任务两大类,这两类的优先级本身就存在差异,微任务的优先级整体高于宏任务。
常见的宏任务类型
- setTimeout回调函数
- setInterval回调函数
- setImmediate(仅Node环境支持)
- requestAnimationFrame(仅浏览器环境支持)
- I/O操作回调
- UI渲染(浏览器环境)
常见的微任务类型
- Promise的then、catch、finally回调
- async函数里await后面的代码
- process.nextTick(仅Node环境支持,优先级最高)
- MutationObserver回调(仅浏览器环境支持)
具体优先级排序规则
在微任务内部,process.nextTick的优先级高于其他微任务;在宏任务内部,不同环境的排序略有差异,浏览器环境下定时器回调的优先级高于requestAnimationFrame,Node环境下setImmediate的优先级低于定时器回调。
整体的优先级从高到低可以整理为:同步代码 > process.nextTick > Promise相关微任务 > 其他微任务 > 宏任务(定时器 > requestAnimationFrame > setImmediate等)。
代码示例验证优先级
下面通过一个浏览器环境的代码示例来验证优先级规则:
// 同步代码
console.log('同步代码1');
// 宏任务setTimeout
setTimeout(() => {
console.log('setTimeout回调');
}, 0);
// Promise微任务
Promise.resolve().then(() => {
console.log('Promise then回调');
});
// async函数微任务
async function testAsync() {
await console.log('async函数内await前代码'); // 这部分是同步代码
console.log('async函数await后代码');
}
testAsync();
// 另一个宏任务setTimeout
setTimeout(() => {
console.log('第二个setTimeout回调');
}, 0);
console.log('同步代码2');
上述代码的执行结果依次是:
- 同步代码1
- async函数内await前代码
- 同步代码2
- Promise then回调
- async函数await后代码
- setTimeout回调
- 第二个setTimeout回调
可以看到微任务的执行都早于宏任务,同步代码又早于所有微任务,符合我们前面提到的优先级规则。
开发中的注意事项
首先不要在微任务里写无限循环的代码,因为微任务队列没执行完之前不会执行宏任务,会导致页面卡死或者Node环境无响应。其次如果需要对异步任务的执行顺序做精确控制,尽量使用Promise或者async/await来组织代码,避免过多依赖setTimeout的时间参数来控制顺序,因为定时器的实际执行时间会受主线程阻塞影响。
另外在Node环境和浏览器环境的优先级规则有细微差异,跨环境开发的时候需要额外注意process.nextTick和setImmediate的兼容问题,避免写出执行顺序不符合预期的代码。
JavaScript异步任务优先级调度事件循环微任务修改时间:2026-06-27 14:33:22