js 事件循环机制 event loop

javascript

javascript 是一门单线程的非阻塞的脚本语言。

单线程：js在执行任务的时候只有一个主线程来处理所有任务。

原因：浏览器交互，如果是多线程，同时对同一个dom节点进行操作会出现问题

非阻塞：js执行异步任务的时候，主线程会挂起这个任务，然后在异步任务返回结果的时候再根据一定规则去执行相应的任务。

javascript 代码执行时，会把变量存在内存不同位置：堆 heap 和 栈 stack。堆中存放着一些对象，栈中存放一些基础类型变量以及对象的指针。

执行栈

当我们调用一个方法的时候，js会生成一个与这个方法对应的执行环境，即执行上下文。

执行环境存在这个方法的私有作用域，上层作用域的指向，方法的参数，变量，this对象。

当一系列方法被依次调用，js同一时间只能执行一个方法，这些方法被放在一个单独的地方，这个地方被称为执行栈。

执行栈可以不断的添加任务，但栈内存有最大值，超出最大值会发生栈溢出。

事件队列

js遇到异步事件后会先将其挂起，然后执行执行栈的其他任务，当一个异步事件返回结果后，js会将这个事件回调任务加入到一个队列，即事件队列。

被放入事件队列的任务不会立刻执行，而是等执行栈的所有任务都执行完毕，主线程处于闲置状态时，主线程会去查找事件队列是否有任务，如果有则从中取出排在第一位的事件，放到执行栈中，如此反复，形成一个循环，即事件循环。

微任务和宏任务

事件队列的异步任务类型分为两类：微任务和宏任务

微任务事件:

• Promise
• new MutaionObserver()
• process.nextTick

宏任务事件：

• script(整体代码)
• setInterval() setTimeout() setImmediate()
• I/O

事件循环机制：

循环首先从宏任务开始，遇到script, 生成执行上下文，当前执行栈执行完毕时会立即先处理所有微任务队列的事件，然后再去宏任务队列中取出事件。同一次事件循环中，微任务在宏任务之前执行

setTimeout(function () {
    console.log(1)
})

new Promise(function(resolve,reject){
    console.log(2)
    resolve(3)
}).then(function(val){
    console.log(val)
})

结果为: 2, 3, 1

node环境的事件循环机制

在node中，事件循环表现出的状态与浏览器中大致相同。node中事件循环的实现是依靠的libuv引擎。

node选择chrome v8引擎作为js解释器，v8引擎将js代码分析后去调用对应的node api，而这些api最后则由libuv引擎驱动，执行对应的任务，并把不同的事件放在不同的队列中等待主线程执行。 因此实际上node中的事件循环存在于libuv引擎中

事件循环：

• timers: 这个阶段执行定时器队列中的回调如 setTimeout() 和 setInterval()。
• I/O callbacks: 这个阶段执行几乎所有的回调。但是不包括close事件，定时器和setImmediate()的回调。
  idle, prepare: 这个阶段仅在内部使用，可以不必理会。
• poll: 等待新的I/O事件，node在一些特殊情况下会阻塞在这里。
• check: setImmediate()的回调会在这个阶段执行。
• close callbacks: 例如socket.on(‘close’, …)这种close事件的回调。