概念
事件循环（Event Loop）是js用来处理异步操作（定时器，promise,事件监听）的一种机制。
基本流程
- 执行栈
js单线程的所有的同步操纵都在执行栈中顺序执行
- 任务队列
异步操作（如 setTimeout、Promise、事件回调等）完成后，会把回调函数放入任务队列，等待主线程空闲时执行。
- 微任务队列（Microtask Queue）和宏任务队列（Macrotask Queue）
- 微任务（Microtask）：Promise.then、MutationObserver、queueMicrotask
- 宏任务（Macrotask）：setTimeout、setInterval、setImmediate、I/O、UI 渲染
- 事件循环（Event Loop）
事件循环不断地做如下事情：
- 先执行执行栈中的同步代码
- 执行完同步代码后，检查微任务队列，依次执行所有微任务
- 微任务队列清空后，取出一个宏任务执行
- 重复上述过程
简单例子
console.log('start');
setTimeout(() => {
console.log('timeout');
}, 0);
Promise.resolve().then(() => {
console.log('promise');
});
console.log('end');
输出顺序
start
end
promise
timeout
- start和end同步代码先执行
- promise 微任务优于宏任务先执行
- timeout 宏任务，最后执行
执行顺序
执行栈（同步代码） --> 微任务队列（Promise等） --> 宏任务队列（setTimeout等）
总结
- JS 先执行同步代码
- 每次事件循环，先清空所有微任务，再执行一个宏任务
- 微任务优先于宏任务
