我是这样理解EventLoop的 (2)

2、区分宏任务中同步代码和异步代码
同步代码:console.log('script start');、console.log('enter promise');和console.log('script end');;
异步代码块:setTimeout和Promise的then(注意:Promise中只有then、catch、finally的执行需要等到结果,Promise传入的回调函数属于同步执行代码);

3、在异步中找出同层的微任务(代码中的Promise的then)和下层事件循环的宏任务(代码中的setTimeout)

4、宏任务的同步代码优先进入主线程,按照自上而下顺序执行完毕;
输出顺序为:

//同步代码执行输出 script start enter promise script end

5、当主线程空闲时,执行该层的微任务

//同层微任务队列代码执行输出 promise then 1 promise then 2

6、首层事件循环结束,进入第二层事件循环(setTimeout包含的执行代码,只有一个同步代码)

//第二层宏任务队列代码执行输出 setTimeout

综合分析最终得出数据结果为:

//首层宏任务代码执行输出 script start enter promise script end //首层微任务队列代码执行输出 promise then 1 promise then 2 //第二层宏任务队列代码执行输出 setTimeout 3、复杂案例分析

  那么,你是否已经了解上述执行过程了呢?如果完全理解上述实例,说明你已经大概知道浏览器中Event Loop的执行机制,但是,要想知道自己是不是完全明白,不妨对于下列多循环的事件循环进行分析检验,给出你的结果:

console.log('1'); setTimeout(function() { console.log('2'); new Promise(function(resolve) { console.log('3'); resolve(); }).then(function() { console.log('4') }) setTimeout(function() { console.log('5'); new Promise(function(resolve) { console.log('6'); resolve(); }).then(function() { console.log('7') }) }) console.log('14'); }) new Promise(function(resolve) { console.log('8'); resolve(); }).then(function() { console.log('9') }) setTimeout(function() { console.log('10'); new Promise(function(resolve) { console.log('11'); resolve(); }).then(function() { console.log('12') }) }) console.log('13')

分析:如下图草稿所示,左上角标a为宏任务队列,左上角标i为微任务队列,同一层循环中,本层宏任务先执行,再执行微任务;本层宏任务中的非微任务异步代码块作为下层循环的宏任务进入下次循环,如此循环执行;

在这里插入图片描述

如果你的与下面的结果一致,恭喜你浏览器环境的Event Loop你已经完全掌握,那么请开始下面的学习:

1->8->13->9->2->3->14->4->10->11->12->5->6->7 四、Node 环境下的 Event Loop

  在Node环境下,浏览器的EventLoop机制并不适用,切记不能混为一谈。这里借用网上很多博客上的一句总结(其实我也是真不太懂):Node中的Event Loop是基于libuv实现的:libuv是 Node 的新跨平台抽象层,libuv使用异步,事件驱动的编程方式,核心是提供i/o的事件循环和异步回调。libuv的API包含有时间,非阻塞的网络,异步文件操作,子进程等等。

1、Event Loop的6阶段

在这里插入图片描述

  Node的Event loop一共分为6个阶段,每个细节具体如下:

timers: 执行setTimeout和setInterval中到期的callback。

pending callback: 上一轮循环中少数的callback会放在这一阶段执行。

idle, prepare: 仅在内部使用。

poll: 最重要的阶段,执行pending callback,在适当的情况下回阻塞在这个阶段。

check: 执行setImmediate的callback。

close callbacks: 执行close事件的callback,例如socket.on('close'[,fn])或者http.server.on('close, fn)。
注意:上面六个阶段都不包括 process.nextTick()

在这里插入图片描述

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zyjjzg.html