网站模板如何使用 如何修改吗,手表官网,网站建设必备条件,广东律师事务所东莞网站建设在 JavaScript 的异步编程模型中#xff0c;宏任务#xff08;Macro Task#xff09;和微任务#xff08;Micro Task#xff09;是事件循环#xff08;Event Loop#xff09;机制中的两个重要概念。它们用于管理异步操作的执行顺序。 1. 宏任务 (Macro Task)
宏任务是较…在 JavaScript 的异步编程模型中宏任务Macro Task和微任务Micro Task是事件循环Event Loop机制中的两个重要概念。它们用于管理异步操作的执行顺序。 1. 宏任务 (Macro Task)
宏任务是较大的任务块它们在事件循环的每一轮迭代中按顺序执行。常见的宏任务包括
setTimeout 和 setIntervalsetImmediate (Node.js 环境)I/O 操作UI 渲染
宏任务的执行流程
每次事件循环从宏任务队列中取出一个任务执行。当一个宏任务执行完后会检查微任务队列是否为空如果不为空优先执行所有微任务队列中的任务。之后事件循环继续进入下一个宏任务。 2. 微任务 (Micro Task)
微任务是更细粒度的任务比宏任务优先级更高。微任务会在当前宏任务执行完后立即执行并在下一个宏任务开始之前完成。
常见的微任务包括
Promise.then/catch/finallyMutationObserverqueueMicrotask
微任务的执行流程
当前宏任务执行完毕后立即执行所有的微任务直到微任务队列为空。新增的微任务会被加入当前微任务队列直到所有微任务都完成。 宏任务和微任务的区别
特性宏任务 (Macro Task)微任务 (Micro Task)优先级优先级低执行顺序在微任务之后优先级高当前宏任务执行后立即执行典型场景setTimeout、setInterval、I/O、UI 渲染等Promise.then、queueMicrotask 等执行时机每次事件循环的起始阶段当前宏任务完成后下一个宏任务之前 实际示例
以下代码展示了宏任务和微任务的执行顺序
console.log(开始); // 同步任务setTimeout(() {console.log(宏任务setTimeout);
}, 0);Promise.resolve().then(() {console.log(微任务Promise);
});console.log(结束); // 同步任务执行顺序
同步任务输出 开始同步任务输出 结束微任务输出 微任务Promise宏任务输出 宏任务setTimeout 图解事件循环
同步任务直接进入主线程执行。微任务进入微任务队列。宏任务进入宏任务队列。
事件循环的顺序为
执行主线程的同步代码。清空微任务队列。执行一个宏任务从宏任务队列中取出。回到第二步重复以上流程。 关键点总结
微任务优先级高于宏任务。微任务适用于需要尽快执行的逻辑如 Promise 的回调。宏任务适用于稍后执行的逻辑如计时器或 I/O 操作。
了解这些机制可以帮助我们更好地调试和优化 JavaScript 代码的异步行为。