事件循环模型

说说JS的事件循环机制 (含满分答题技巧)
20 | async/await：使用同步的方式去写异步代码
Event Loop即事件循环，是指浏览器或Node的一种解决javaScript单线程运行时不会阻塞的一种机制，也就是我们经常使用异步的原理。
JavaScript代码执行过程，除了使用调用栈来控制执行顺序外，还通过任务队列来控制其他代码执行顺序。任务队列又分为 宏任务和微任务。整体执行顺序 先执行宏任务,宏任务执行完，再执行宏任务产生的微任务。宏任务包括。script setTimeout setInterval setImmediate I/O UI render 微任务 promsie.then process.nextTick async await MutationObserver

需要了解下面两个问题

1. async/await 执行顺序注意点是什么
2. 事件循环机制整体流程是什么

JavaScript代码的执行过程中,除了依靠函数调用栈来搞定函数的执行顺序外,还依靠任务队列(task queue)来搞定另外一些代码的执行。整个执行过程,我们称为事件循环过程。一个线程中,事件循环使唯一de,但是任务队列可以拥有多个。任务队列又分为 macro-task(宏任务)与micro-task(微任务),在最新的标准中,它们被分为task与jobs。

macro-task大概包括:

1. script(整体代码)
2. setTimeout
3. setInterval
4. setImmediate
5. I/O

6. UI render

   micro-task大概包括:

7. process.nextTick

8. Promsie
9. Async/Await(实际就是promise)
10. MutationObserver(html5新特性)

总的结论就是，执行宏任务，然后执行该宏任务产生的微任务，若微任务在执行过程中产生了新的微任务，则继续执行微任务，微任务执行完毕后，再回到宏任务中进行下一轮循环

async/await执行顺序注意

async function foo() {
    console.log(1)
    let a = await 100
    console.log(a)
    console.log(2)
}
console.log(0)
foo()
console.log(3)

我们知道async隐式返回 Promise 作为结果的函数,那么可以简单理解为，await后面的函数执行完毕时，await会产生一个微任务(Promise.then是微任务)。但是我们要注意这个微任务产生的时机，它是执行完await之后，直接跳出async函数，执行其他代码(此处就是协程的运作，A暂停执行，控制权交给B)。其他代码执行完毕后，再回到async函数去执行剩下的代码，然后把await后面的代码注册到微任务队列当中

注意

1. 如果await 后面直接跟的为一个变量，比如：await 1；这种情况的话相当于直接把await后面的代码注册为一个微任务，可以简单理解为promise.then(await下面的代码)。然后跳出async1函数，执行其他代码，当遇到promise函数的时候，会注册promise.then()函数到微任务队列，注意此时微任务队列里面已经存在await后面的微任务。所以这种情况会先执行await后面的代码（async1 end），再执行async1函数后面注册的微任务代码(promise1,promise2)
2. 如果await后面跟的是一个异步函数的调用。此时执行完awit并不先把await后面的代码注册到微任务队列中去，而是执行完await之后，直接跳出async1函数，执行其他代码。然后遇到promise的时候，把promise.then注册为微任务。其他代码执行完毕后，需要回到async1函数去执行剩下的代码，然后把await后面的代码注册到微任务队列当中，注意此时微任务队列中是有之前注册的微任务的。所以这种情况会先执行async1函数之外的微任务(promise1,promise2)，然后才执行async1内注册的微任务(async1 end).

可以理解为，这种情况下，await 后面的代码会在本轮循环的最后被执行.

Node.js事件循环

说说Node的事件循环机制

可以看到，这一流程包含 6 个阶段，每个阶段代表的含义如下所示。

（1）timers：本阶段执行已经被 setTimeout() 和 setInterval() 调度的回调函数，简单理解就是由这两个函数启动的回调函数。

（2）pending callbacks：本阶段执行某些系统操作（如 TCP 错误类型）的回调函数。

（3）idle、prepare：仅系统内部使用，你只需要知道有这 2 个阶段就可以。

（4）poll：检索新的 I/O 事件，执行与 I/O 相关的回调，其他情况 Node.js 将在适当的时候在此阻塞。这也是最复杂的一个阶段，所有的事件循环以及回调处理都在这个阶段执行，接下来会详细分析这个过程。

（5）check：setImmediate() 回调函数在这里执行，setImmediate 并不是立马执行，而是当事件循环 poll 中没有新的事件处理时就执行该部分