JavaScript中的宏任务和微任务

以下是关于 JavaScript 中 宏任务（Macro Task） 和 微任务（Micro Task） 的系统梳理，涵盖核心概念、执行规则、应用场景及进阶知识，帮助我们彻底掌握异步编程的底层机制。

---

一、基础概念

1. 宏任务（Macro Task）

• 定义：由宿主环境（浏览器/Node.js）发起的任务，代表一个独立的、完整的逻辑单元。
• 常见来源：
  • setTimeout / setInterval
  • I/O 操作（文件读写、网络请求）
  • DOM 事件回调（点击、滚动）
  • requestAnimationFrame（浏览器）
  • setImmediate（Node.js）

2. 微任务（Micro Task）

• 定义：由 JavaScript 引擎发起的任务，通常用于处理高优先级的异步操作。
• 常见来源：
  • Promise.then / Promise.catch / Promise.finally
  • MutationObserver（浏览器）
  • queueMicrotask
  • process.nextTick（Node.js，优先级高于其他微任务）

---

二、执行顺序规则

1. 事件循环流程

1. 执行当前调用栈（同步代码）。
2. 检查微任务队列：清空所有微任务（递归处理新添加的微任务）。
3. 执行一个宏任务：从宏任务队列中取出一个任务执行。
4. 重复步骤 2-3，形成事件循环。

2. 经典执行顺序示例

console.log("Script start"); // 同步任务（宏任务）

setTimeout(() => console.log("setTimeout"