浏览器微任务,宏任务

187 阅读1分钟

任务队列中的任务分为微任务 宏任务,当执行栈清空后,会先检查任务队列中是否有微任务,如果有就按照先进先出的原则,压入执行栈中执行。微任务中产生了新的微任务不会推迟到下一个循环中,而是在当前循环中继续执行。当执行这一轮的微任务完毕后,开启下一轮循环,执行任务队列中的宏任务。

微任务:

  • Promise.then
  • async/await
  • Process.nexTick(Node独有)
  • Mutation Observer

宏任务:

  • script全部代码
  • setTimeout、setInterval
  • Ajax
  • DOM 事件,例如点击事件、输入事件
  • I/O、UI渲染

执行顺序

  • 执行宏任务中的同步代码,遇到宏任务或微任务,分别放入对应的任务队列,等待执行。

  • 当所有同步任务执行完毕后,执行栈为空,首先执行微任务队列中的任务

  • 微任务执行完毕后,检查这次执行中是否产生新的微任务,如果存在,重复执行步骤,直到微任务执行完毕。

  • 开始下一轮Event Loop,执行宏任务中的代码

image.png