JS任务机制 - springboot实战电商项目mall4j

最新推荐文章于 2024-08-09 07:41:55 发布

mall4j

最新推荐文章于 2024-08-09 07:41:55 发布

阅读量1.1k

点赞数

文章标签： javascript spring boot java

本文链接：https://blog.csdn.net/mall4j/article/details/122561616

版权

工作一段时间了，今天在这总结一下浏览器执行JS任务机制。在本人日常工作中，做的最多的两点，分别是



 	1.对设计图进行HTML CSS的编写

 	2.对接口请求来的数据进行页面渲染

对请求回来的数据进行处理时会涉及到异步函数，而JS执行代码的时候会先执行同步任务，再执行异步任务。

这时要是执行同步任务里面需要用到一个异步任务的里面值就会抛出错误，为什么会这样了，下面就从基本的

开始讲解了。

浏览器内核是多线程的，具体有那些呢如下图所示

## 2.1 GUI渲染线程

主要是负责渲染和解析HTML，CSS，构建DOM树，当对HTML标签进行v-if v-show 等诸如此类的操作时会触发界面的重绘和重排

此时该线程就会执行。

在JS引擎执行时会处于休眠状态会放到另一个任务队列中，当JS对DOM，CSS等进行操作时，会保留更新状态等到JS引擎空闲时

就会被立即执行。

主要负责处理JavaScript脚本程序，JS引擎在处理完主线程的任务时，会一直等待任务队列的任务到来，直到无任务可执行，此时就会

涉及到一个问题，因为JS是可以对Dom进行操作的，这样就有可能会出现渲染出错的一系列问题，所以浏览器是不允许两者同时执行的

GUI线程会等到JS线程执行完后才会执行期间做出的GUI更新会保存起来。

在进行网络请求时，会开辟一个新进程，防止阻塞JS引擎执行，当状态发生变化时会从任务队列中调回JS主线程中，如请求结果是400，200 这些状态时

JS代码中setTimeout和setInterval，这两个定时器触发时为了不影响其准确性，浏览器也会新开个线程，来放置，当计时结束时会先放到

事件线程中然后在等JS引擎空闲时执行

JS中的点击触摸等事件触发该线程时会把事件添加到待处理队列的队尾，等待JS引擎的处理

相对于浏览器的多线程，JS引擎则是单线程的，其中的历史原因就不细讲了。正因是单线程，JS执行代码时从上而下执行时，会有HTTP请求，定时器等，不可能等到他们执行完才进行下一步，这样会影响用户体验，这时就需要任务队列的帮助了，下面画了张图便于理解

关注