JavaScript通过事件循环实现异步，核心是宏任务与微任务协作：先执行同步代码，再清空微任务队列，然后执行下一个宏任务。例如setTimeout为宏任务，Promise.then为微任务，故输出顺序为start、end、promise、timeout。
JavaScript 是单线程语言，意味着同一时间只能执行一个任务。但通过事件循环（Event Loop），JS 能够实现异步操作的管理与调度，从而让程序在等待某些操作（如网络请求、定时器）完成时不会阻塞主线程。理解事件循环是掌握 JS 异步机制的关键。
调用栈与任务队列
JS 引擎在执行代码时使用调用栈来追踪函数的执行顺序。每当一个函数被调用，它就会被推入栈顶；函数执行完毕后，从栈中弹出。
然而，异步操作（比如 setTimeout、fetch）并不会立即执行回调函数，而是交由浏览器的其他模块（如定时器模块、网络模块）处理。当这些操作完成时，对应的回调函数会被放入任务队列（也叫回调队列）中。
任务队列是一个先进先出的队列，存放着等待执行的回调函数。但它们不会立刻执行，必须等到调用栈为空，并且事件循环将它们从队列中取出并推入调用栈时才会执行。
宏任务与微任务
事件循环中的任务分为两类：宏任务（macrotask） 和 微任务（microtask）。这两类任务有不同的执行优先级和队列机制。
常见的宏任务包括：- setTimeout 回调
- setInterval 回调
- I/O 操作
- UI 渲染
- Promise 的 .then、.catch、.finally 回调
- MutationObserver
- queueMicrotask()
每次事件循环迭代中，JS 引擎会先执行所有同步代码，然后清空微任务队列（即执行所有当前可用的微任务），再取一个宏任务执行。这个过程不断重复。
事件循环执行流程
一个典型的事件循环流程如下：
- 执行全局同步代码，可能产生宏任务或微任务
- 当一个宏任务执行完毕后，检查是否有微任务待执行
- 如果有，依次执行所有微任务（注意：微任务执行过程中产生的新微任务也会被立即执行）
- 微任务队列清空后，进行 UI 渲染（如果需要），然后开始下一个宏任务的执行
举个例子：
console.log('start');
setTimeout(() => {
console.log('timeout');
}, 0);
Promise.resolve().then(() => {
console.log('promise');
});
console.log('end');
输出顺序是：start → end → promise → timeout。因为 Promise 的 then 回调是微任务，在当前宏任务结束后立即执行；而 setTimeout 是宏任务，要等下一轮事件循环才执行。
实际应用中的注意事项
微任务的高优先级可能导致一些意外行为。例如，如果在微任务中不断创建新的微任务，可能会导致宏任务长时间得不到执行，造成页面卡顿。
避免在微任务中进行大量计算或递归调用。对于需要延迟执行但不紧急的操作，可以考虑使用 queueMicrotask 或 setTimeout 来合理安排执行时机。
基本上就这些。事件循环看似复杂，核心逻辑就是：宏任务交替执行，中间穿插清空微任务队列。掌握这一点，JS 异步行为就清晰多了。
