JS单线程进一步理解

116 阅读2分钟

有关JS单线程方面,在阅读了部分资料后又有了进一步的理解,在此写成文章方便自己加深印象与梳理

引用掘金大佬的链接 juejin.cn/post/684490…

在了解JS单线程的时候,我们先知道常用的chrome的浏览器,他的进程

image.png

其中,渲染进程中的JS引擎线程就是我们常说的JS单线程。

渲染进程包括了

  • GUI线程
  • JS引擎线程
  • 定时触发器线程
  • 事件触发线程
  • 异步HTTP请求线程
GUI线程

渲染页面用的,解析html中的dom树和css,用以渲染。

JS引擎线程

我们所说的JS单线程(也是JS主线程),注意JS单线程和GUI线程是互斥的。

定时触发器线程

JS中的setTimeout和setInterval都是在这里执行,并不在JS引擎执行,在定时器事件执行完成之后,他就会将执行完成的事件交由事件触发线程放到事件队列中去。

事件触发线程

事件触发线程会将所有执行完,满足条件的事件存放到事件队列中去。然后由JS主线程去调动执行。

异步HTTP请求线程

和定时器触发线程一样,在执行完相应的ajax等异步任务请求后,通过事件触发线程交由事件队列,再由JS主线程去执行调动。

JS的宏任务与微任务

微任务拥有更高的优先级,当事件循环遍历队列时,先检查微任务队列,如果里面有任务,就全部拿来执行,执行完之后再执行一个宏任务。执行每个宏任务之前都要检查下微任务队列是否有任务,如果有,优先执行微任务队列。所以完整的流程图如下:

image.png

接下来就可以去看JS的event Loop事件循环机制了 juejin.cn/post/706756…