image.png

事件循环

  • 同步和异步任务不同的执行方式,同步任务进入主线程,异步任务进入Event Table并注册回调函数
  • 当指定的事情完成时,Event Table会将这个函数移入Event Queue
  • Js引擎持续不断的检查主线程执行栈是否为空,主线程内的任务执行完毕为空,会去事件队列 Event Queue读取等待被调用的函数,进入主线程执行
  • 不断重复读取事件队列,就是Event Loop

macrotask(宏任务)和microtask(微任务),js引擎会优先执行微任务
微任务包括了 promise 的回调、node 中的 process.nextTick 、对 Dom 变化监听的 MutationObserver。

宏任务包括了 script 脚本的执行、setTimeout ,setInterval ,setImmediate 一类的定时事件,还有如 I/O 操作、UI 渲
染等。

  • 首先js 是单线程运行的,在代码执行的时候,通过将不同函数的执行上下文压入执行栈中来保证代码的有序执行。
  • 在执行同步代码的时候,如果遇到了异步事件,js 引擎并不会一直等待其返回结果,而是会将这个事件挂起,继续执行执行栈中的其他任务
  • 当同步事件执行完毕后,再将异步事件对应的回调加入到与当前执行栈中不同的另一个任务队列中等待执行。
  • 任务队列可以分为宏任务对列和微任务对列,当当前执行栈中的事件执行完毕后,js 引擎首先会判断微任务对列中是否有任务可以执行,如果有就将微任务队首的事件压入栈中执行。
  • 当微任务对列中的任务都执行完成后再去判断宏任务对列中的任务
  1. setTimeout(function() {
  2. console.log(1)
  3. }, 0);
  4. new Promise(function(resolve, reject) {
  5. console.log(2);
  6. resolve()
  7. }).then(function() {
  8. console.log(3)
  9. });
  10. process.nextTick(function () {
  11. console.log(4)
  12. })
  13. console.log(5)
  14. // 25431