js事件循环event loop

简单来说浏览器主要执行循序:

1. 所有同步脚本 -> 2. microtask queue微队列里所有事件 -> 3. macrotask queue宏队列队首事件 -> 1...

备注:在步骤2或3中产生的microtask微任务会继续加入到microtask queue微队列的队尾。

那什么是microtask,什么是macrotask呢?

microtask:

  1. Promise
  2. process.nextTick (Node独有)
  3. Object.observe
  4. MutationObserver

macrotask:

  1. setTimeout
  2. setInterval
  3. setImmediate (Node独有)
  4. requestAnimationFrame (浏览器独有)
  5. I/O
  6. UI rendering (浏览器独有)

举个例子:

setTimeout(() => {
  console.log(3)
  Promise.resolve().then(() => {
    console.log(2)
  });
});

console.log(1);

new Promise((resolve, reject) => {
  console.log(4)
  resolve(5)
}).then((data) => {
  console.log(data);
})

setTimeout(() => {
  console.log(6);
})
console.log(7);

请在评论里留下你的答案吧~

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容