宏任务是事件循环中的任务单元，如script、setTimeout、setInterval、I/O和UI渲染，每次执行完一个宏任务后会执行所有微任务；微任务如Promise回调、queueMicrotask、MutationObserver具有更高优先级，在当前宏任务结束后立即执行。执行顺序为：同步代码 → 微任务 → 下一个宏任务。例如console.log(‘1’)、setTimeout(() => console.log(‘2’), 0)、Promise.resolve().then(() => console.log(‘3’))、console.log(‘4’)的输出结果是1 → 4 → 3 → 2，因’1’和’4’为同步代码先执行，Promise.then为微任务在宏任务结束后执行，setTimeout为宏任务最后执行。事件循环流程为：执行全局脚本（宏任务）→ 遇异步操作注册到对应队列→ 宏任务结束执行所有微任务→ 清空微任务后进入下一宏任务。微任务在宏任务间“插队”且全部执行完才继续下一宏任务，确保异步逻辑尽快响应。
JavaScript 是单线程语言，通过事件循环（Event Loop）实现异步操作的处理。理解微任务与宏任务队列，关键在于搞清楚不同异步任务的执行优先级和执行时机。
宏任务（Macrotask）是什么？
宏任务是事件循环中的一类任务单元，每次执行完一个宏任务后，会检查并执行所有可用的微任务。常见的宏任务包括：
整体脚本代码（script） setTimeout 回调 setInterval 回调 I/O 操作 UI 渲染
每个宏任务在事件循环中被依次执行，中间穿插微任务的处理。
微任务（Microtask）又是什么？
微任务在当前宏任务执行结束后、下一个宏任务开始前立即执行。它们具有更高的优先级。常见的微任务有：
立即学习“Java免费学习笔记（深入）”；
Promise 的 .then、.catch、.finally 回调 queueMicrotask() 函数添加的任务 MutationObserver 回调（DOM 变动监听）
一旦一个宏任务执行完成，JavaScript 引擎会清空整个微任务队列，把所有微任务执行完，才进入下一个宏任务。
执行顺序的实际例子
看一段代码来直观感受执行顺序：
console.log(‘1’);
setTimeout(() => console.log(‘2’), 0);
Promise.resolve().then(() => console.log(‘3’));
console.log(‘4’);
输出结果是：1 → 4 → 3 → 2
解释过程：
‘1’ 和 ‘4’ 是同步代码，直接输出 setTimeout 是宏任务，放入宏任务队列等待 Promise.then 是微任务，在当前宏任务结束后立即执行 所以先输出 ‘3’，再从宏任务队列取出 ‘2’ 输出
事件循环如何协调两者？
事件循环的基本流程如下：
执行全局脚本，这是一个宏任务 执行过程中遇到异步操作，将其回调注册到对应的队列（宏或微） 当前宏任务执行完毕，立即执行所有排队的微任务 微任务清空后，进入下一个宏任务，重复上述过程
这个机制保证了像 Promise 这样的异步逻辑能尽快响应，而不必等到下一轮事件循环。
基本上就这些。掌握微任务和宏任务的区别，关键是记住：微任务在宏任务之间“插队”，而且会全部执行完才继续下一个宏任务。这在处理异步逻辑、避免界面卡顿等方面非常关键。
以上就是如何理解JavaScript中的微任务与宏任务队列？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1525985.html
微信扫一扫 
支付宝扫一扫 
