JS线程与事件循环解析

　　JS是单线程，JS代码从上到下依次执行，但是单线程有一个非常大的问题，遇到耗时的任务，后面的任务只能等待它执行完，才能接着执行。比如ajax请求，从服务器上获取数据，本身是耗时的，如果遇到网络波动，就更耗时，只能等待它的返回结果再接着执行后面的任务。如果处在渲染阶段，也会阻塞渲染。

　　基于此，JS引入了异步的概念，当遇到耗时的任务，JS将其压入事件队列，先执行后面的任务，等主线程的任务执行完毕，再处理事件队列中的任务。以ajax请求为例，当JS执行到ajsx函数的时候，其实是去告诉浏览器执行http请求，然后立即返回主线程栈执行后面的任务，当浏览器拿到服务器返回数据，将数据传给ajax回调函数，并将回调函数压入到事件队列中。当主线程的任务全部执行完，就会去轮询事件队列，一旦发现事件队列的回掉函数，依次取出放至执行栈中执行；在程序执行过程中，js会一直执行轮询，直到程序结束。

　　JS主线程工作流程：JS代码加载完成，创建全局执行环境，至上而下依次执行任务。遇到非异步函数，将创建函数执行环境，函数执行完即销毁，执行下个任务；直到全局执行环境代码执行完毕，执行栈为空。

　　JS事件循环队列流程：当执行栈为空，JS会去轮询事件队列，在事件队列取起始位置第一个任务（注册的回调函数）放到执行栈中执行，等回调函数执行完毕，执行栈为空，再次轮询事件队列，步骤如上。在整个程序执行过程中，js会一直轮询事件队列，一有任务就会执行上述过程，该过程称为事件循环。

　　注意：所有程序都在执行栈中执行，只有执行栈为空，才有能力执行下一个任务。所以这也要求，回调函数中不能执行太多任务，如果执行太多任务，栈就不为空，也就阻止了下一个任务的执行，造成阻塞。

　　promise.then,process.nextTick, setTimeout 以及 setImmediate 的执行顺序：

setImmediate(function(){console.log(1);
},0);
setTimeout(function(){console.log(2);
},0);
new Promise(function(resolve){console.log(3);resolve();console.log(4);
}).then(function(){console.log(5);
});
console.log(6);
process.nextTick(function(){console.log(7);
});
console.log(8);// 3 4 6 8 7 5 2 1

关于优先级：

　　每次轮询事件队列，各观察者的优先级为：

　　idle观察者》I/O观察者》check观察者

　　idle观察者：process.nextTick

　　I/O观察者：一般性的I/O回调，如网络，文件，数据库I/O等

　　check观察者：setTimeout>setImmediate

　　注：promise本身不是异步函数且优先级大于async

转载于:https://www.cnblogs.com/xuxiaoqiangAndHM/p/10903599.html

JS线程与事件循环解析相关推荐

工作流节点子线程_节点JS体系结构–单线程事件循环
工作流节点子线程 Today we will look into Node JS Architecture and Single Threaded Event Loop model. In our ...
JS 总结之事件循环
众所周知,JavaScript 为了避免复杂,被设计成了单线程. ⛅️ 任务单线程意味着所有任务都需要按顺序执行,如果某个任务执行非常耗时,线程就会被阻断,后面的任务需要等上一个任务执行完毕才会进行 ...
浅析JS异步、事件循环任务队列
站在前人肩膀上可以看得更远,也不一定,至少比你自己看得远. 一.带着问题去想问题:JS为什么是单线程? 为什么需要异步?单线程又是如何实现异步的? 第一个问题:javaScript最初被设计用在浏览 ...
js中如何得到循环中的点击的这个id_Js篇面试题9请说一下Js中的事件循环机制
虽互不曾谋面,但希望能和您成为笔尖下的朋友以读书,技术,生活为主,偶尔撒点鸡汤不作,不敷衍,意在真诚吐露,用心分享点击左上方,可关注本刊标星公众号(ID:itclanCoder) 如果不知道如 ...
详解队列在前端的应用，深剖JS中的事件循环Eventloop，再了解微任务和宏任务
队列在前端中的应用一.队列是什么二.应用场景三.前端与队列:事件循环与任务队列 1.event loop 2.JS如何执行 3.event loop过程 4. DOM 事件和 event loo ...
【nodejs原理源码赏析（7）】【译】Node.js中的事件循环，定时器和process.nextTick
[摘要] 官网博文翻译,nodejs中的定时器示例代码托管在:http://www.github.com/dashnowords/blogs 原文地址:https://nodejs.org/en/d ...
5.node.js中的事件循环
先举一个简单的例子 const bar = () => console.log('bar')const baz = () => console.log('baz')const foo = ...
Js篇-面试题9-请说一下Js中的事件循环机制
虽互不曾谋面,但希望能和您成为笔尖下的朋友以读书,技术,生活为主,偶尔撒点鸡汤不作,不敷衍,意在真诚吐露,用心分享点击左上方,可关注本刊标星公众号(ID:itclanCoder) 如果不知道如 ...
js中的事件循环和宏任务和微任务的理解
参考许多大神的文章,写下自己的理解事件循环: 说到事件循环就得谈到js中同步和异步的执行顺序 1.javascript将任务分为同步任务和异步任务,同步任务放到主线中,异步函数首先进行回调函数注册. ...

JS线程与事件循环解析

JS线程与事件循环解析相关推荐

最新文章

热门文章