事件循环通过宏任务与微任务的协作实现异步，调用栈清空后优先执行微任务，再取宏任务，形成循环。
JavaScript事件循环是理解JS异步编程的核心。它决定了代码的执行顺序，尤其是在处理异步任务时。由于JS是单线程语言，同一时间只能处理一个任务，事件循环机制让JS能够在不阻塞主线程的情况下处理异步操作，比如定时器、网络请求和用户交互。
事件循环的基本构成
事件循环依赖于几个关键部分协同工作：
- 调用栈（Call Stack）：记录当前正在执行的函数。函数被调用时入栈，执行完毕后出栈。
- 回调队列（Callback Queue）：存放已经完成但尚未执行的异步回调函数，比如setTimeout的回调。
- 微任务队列（Microtask Queue）：优先级高于回调队列，存放Promise、MutationObserver等产生的微任务。
- 事件循环主体：持续检查调用栈是否为空，若为空，则先清空微任务队列，再从回调队列中取任务执行。
每次事件循环迭代都会优先处理所有微任务，然后再处理一个宏任务（如setTimeout），这是理解异步执行顺序的关键。
宏任务与微任务的区别
异步任务分为宏任务和微任务，它们进入不同的队列，执行时机也不同。
立即学习“Java免费学习笔记（深入）”；
- 宏任务：包括setTimeout、setInterval、I/O、UI渲染、script整体代码块等。
- 微任务：包括Promise.then/catch/finally、queueMicrotask、MutationObserver等。
执行流程如下：
- 执行全局script同步代码。
- 遇到异步任务，根据类型放入对应的任务队列。
- 同步代码执行完毕，调用栈清空。
- 事件循环检查微任务队列，将所有微任务依次执行。
- 取出一个宏任务执行，执行完后再清空当前所有微任务。
- 重复以上过程。
例如：
console.log('start');
setTimeout(() => console.log('timeout'), 0);
Promise.resolve().then(() => console.log('promise'));
console.log('end');
输出顺序为：start → end → promise → timeout。因为Promise的then属于微任务，在本轮宏任务结束后立即执行，而setTimeout是宏任务，需等待下一轮事件循环。
浏览器与Node中的事件循环差异
虽然核心机制相似，但浏览器和Node.js在事件循环实现上略有不同。
- 浏览器环境：事件循环按阶段清晰划分，每轮循环处理一个宏任务后，立即执行所有微任务。
- Node环境：有更复杂的阶段划分，如timers、pending callbacks、poll、check等。setImmediate()在check阶段执行，比setTimeout(fn, 0)可能更快。
在Node中，以下代码的输出可能因版本而异：
setTimeout(() => console.log('timeout'), 0);setImmediate(() => console.log('immediate'));
如果I/O未完成，setImmediate可能先于setTimeout执行；否则顺序不确定。这说明Node的事件循环更依赖当前所处阶段。
实际应用中的意义
理解事件循环有助于写出更可靠的异步代码。
- 避免长时间同步操作阻塞主线程，影响用户体验。
- 合理使用Promise和async/await，注意微任务的执行时机。
- 在需要延迟执行时，明确setTimeout与queueMicrotask的区别。
- 调试异步问题时，能准确预判回调执行顺序。
比如，使用queueMicrotask可以确保某个逻辑在当前任务结束后、下一个事件循环前执行，比setTimeout(0)更及时。
基本上就这些。事件循环看似复杂，但抓住“宏任务 vs 微任务”、“调用栈清空后先清微任务”这两个核心点，就能应对大多数场景。不复杂但容易忽略。
