事件循环理解

事件循环

同步和异步任务分别进入不同的执行环境，同步的进入主线程，即主执行栈，异步的进入任务队列 (Event Queue，机制为先进先出)。主线程内的任务执行完毕为空，会去任务队列读取对应的任务，推入主线程执行。 上述过程的不断重复就是我们说的 Event Loop (事件循环)。

在事件循环中，每进行一次循环操作称为tick，先执行完微任务，再执行宏任务.

宏任务主要包含：script( 整体代码)、setTimeout、setInterval、I/O、UI 交互事件、setImmediate(Node.js 环境)
微任务主要包含：Promise、MutaionObserver、process.nextTick(Node.js 环境)

补充:

process.nextTick:在事件循环之前执行这个回调(优先执行于普通的微任务),它具有阻止事件循环继续的优势，适用于在事件循环继续之前，提醒用户有错误发生。

setImmediate:立即执行,回调函数会被放置到事件循环的check阶段

大量的计算型任务放在主线程中执行的会阻塞主线程;主线程一旦被阻塞，其他任务就需要等待，所以这种类型的任务最好交给C++维护线程去执行.

可以通过setImmediate方法将任务放入事件循环中的check阶段，因为代码在这一个阶段执行不会阻塞主线程，也不会阻塞事件循环。

function sleep(delay) {
  var start = new Date().getTime()
  while (new Date().getTime() - start < delay) {
    continue
  }
  console.log('ok')
}

console.log('start')
setImmediate(sleep, 2000)
console.log('end')
输出start-end-ok

MutationObserver:用来监视 DOM 变动,DOM 的任何变动，比如节点的增减、属性的变动、文本内容的变动都会触发MutationObserver

Mutation Observer 有以下特点：

• 它等待所有脚本任务完成后，才会运行（即异步触发方式）。
• 它把 DOM 变动记录封装成一个数组进行处理，而不是一条条个别处理 DOM 变动。
• 它既可以观察 DOM 的所有类型变动，也可以指定只观察某一类变动。