JS执行机制---1

1|0js的执行机制

1|01.JavaScript是一门单线程语言。

为什么说js是单线程,因为js执行代码是从上往下执行的,

1|02.Event Loop(事件循环)是JavaScript的执行机制。

事件循环、eventloop\运行机制 这三个术语其实说的是同一个东西，

“先执行同步操作异步操作排在事件队列里”这样的理解其实也没有任何问题但如果深入的话会引出很多其他概念，

 比如event table(事件表)和event queue(事件队列), 我们来看运行过程：

当代码从上往下执行时,

1.首先判断JS是同步还是异步，同步就进入主线程运行，异步就进入event table.

2.异步任务在event table中注册事件，当满足触发条件后，（触发条件可能是延时也可能是ajax回调），被推入event queue

3.同步任务进入主线程后一直执行，直到主线程空闲时，才会去event queue中查看是否有可执行的异步任务，如果有就推入主线程中。

js引擎会监视js执行的进程,会持续不断的检查 主线程 执行栈是否为空，一旦为空，就会去event queue那里检查是否有等待被调用的函数。

console.log(1) // 同步任务进入主线程
setTimeout(fun(),0)   // 异步任务，被放入event table， 0秒之后被推入event queue里
console.log(3) // 同步任务进入主线程

---

除了广义上分为同步任务,异步任务,任务还有更精细的定义:

1. 宏任务     包含整个script代码块，setTimeout
2. 微任务      Promise,异步ajax

在事件循环（主线程 → 事件队列）中其实有更细致的操作流程，即（宏任务 → 微任务）之间的循环，如下图所示：

所以通常来说，我们页面中的js执行顺序是这样的：

• 第一轮事件循环：

1. 主线程执行js整段代码（宏任务），将ajax、setTimeout、promise等回调函数注册到Event Queue，并区分宏任务和微任务。
2. 主线程提取并执行Event Queue 中的ajax、promise等所有微任务，并注册微任务中的异步任务到Event Queue。

• 第二轮事件循环：

1. 主线程提取Event Queue 中的第一个宏任务（通常是setTimeout）。
2. 主线程执行setTimeout宏任务，并注册setTimeout代码中的异步任务到Event Queue（如果有）。
3. 执行Event Queue中的所有微任务，并注册微任务中的异步任务到Event Queue（如果有）。

• 类似的循环：宏任务每执行完一个，就清空一次事件队列中的微任务。

注意：事件队列中分“宏任务队列”和“微任务队列”，每执行一次任务都可能注册新的宏任务或微任务到相应的任务队列中，只要遵循“每执行一个宏任务，就会清空一次事件队列中的所有微任务”这一循环规则，就不会弄乱。

 

参考:https://juejin.cn/post/6844903667301089288

__EOF__

本文作者：长安
本文链接：https://www.cnblogs.com/jingxin01/p/16392865.html
关于博主：评论和私信会在第一时间回复。或者直接私信我。
版权声明：本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！
声援博主：如果您觉得文章对您有帮助，可以点击文章右下角【推荐】一下。您的鼓励是博主的最大动力！