微任务和宏任务之间的优先级

微任务和宏任务的优先级关系

微任务优先宏任务

事件循环

JavaScript 是一种单线程语言，这意味着它一次只能执行一个任务。事件循环是管理这些任务的机制，它包含以下几个重要步骤：

1. 执行全局代码：当一个脚本加载和执行时，全局代码首先执行。
2. 执行栈（Call Stack）：这是一个 LIFO（Last In, First Out）结构，当前正在执行的任务总是位于栈顶。
3. 任务队列（Task Queue）：这是一个 FIFO（First In, First Out）结构，包含即将要执行的任务。

微任务和宏任务

宏任务（Macrotasks）：这些包括诸如 setTimeout, setInterval, setImmediate, I/O 操作和 UI 渲染等。

微任务（Microtasks）：这些通常由 Promise 回调、MutationObserver 和 process.nextTick（在 Node.js 中）产生。

执行顺序

1. 优先执行一个宏任务
2. 判断是否有微任务（无：继续执行宏任务）
3. 有：执行所有的微任务
4. 开始下一个宏任务

为什么微任务优先于宏任务？

当一个宏任务执行完毕后，JavaScript 引擎会立即检查微任务队列，并执行所有微任务。微任务队列为空后，引擎才会继续执行下一个宏任务。这种机制的原因包括以下几个方面：

1. 提高响应速度微任务通常是处理细粒度的异步操作，如 Promise 回调。优先处理微任务可以使得应用对用户交互和数据变化做出更快的响应，从而提升用户体验。
2. 保持状态一致性：在执行微任务时，保证了所有相关的异步操作在同一个宏任务执行周期内完成。这有助于在执行下一个宏任务之前，确保应用状态的一致性和数据的完整性。
3. 防止饿死（Starvation）：由于微任务优先于宏任务，所以即使微任务不断产生（例如在一个微任务中不断创建新的微任务），宏任务依然能够在微任务队列处理完毕后得到执行，避免了可能的宏任务饿死问题。