美文网首页
事件循环

事件循环

作者: yueluoxingliu | 来源:发表于2022-06-25 20:25 被阅读0次

JS运行的环境称之为宿主环境。

执行栈:call stack,一个数据结构,用于存放各种函数的执行环境,每一个函数执行之前,它的相关信息会加入到执行栈。函数调用之前,创建执行环境,然后加入到执行栈;函数调用之后,销毁执行环境。

JS引擎永远执行的是执行栈的最顶部。

异步函数:某些函数不会立即执行,需要等到某个时机到达后才会执行,这样的函数称之为异步函数。比如事件处理函数。异步函数的执行时机,会被宿主环境控制。

浏览器宿主环境中包含5个线程:

1. JS引擎:负责执行执行栈的最顶部代码

2. GUI线程:负责渲染页面

3. 事件监听线程:负责监听各种事件

4. 计时线程:负责计时

5. 网络线程:负责网络通信

当上面的线程发生了某些事请,如果该线程发现,这件事情有处理程序,它会将该处理程序加入一个叫做事件队列的内存。当JS引擎发现,执行栈中已经没有了任何内容后,会将事件队列中的第一个函数加入到执行栈中执行。

JS引擎对事件队列的取出执行方式,以及与宿主环境的配合,称之为事件循环。

事件队列在不同的宿主环境中有所差异,大部分宿主环境会将事件队列进行细分。在浏览器中,事件队列分为两种:

- 宏任务(队列):macroTask,计时器结束的回调、事件回调、http回调等等绝大部分异步函数进入宏队列

- 微任务(队列):MutationObserver,Promise产生的回调进入微队列

> MutationObserver用于监听某个DOM对象的变化

当执行栈清空时,JS引擎首先会将微任务中的所有任务依次执行结束,如果没有微任务,则执行宏任务。

相关文章

  • 浅谈JavaScript事件循环与Vue的批量异步更新策略

    在介绍事件循环之前,首先要明确以下几个关键概念。事件循环,同步和异步任务,宏任务,微任务。 一.事件循环 事件循环...

  • 并发:事件循环 & asyncio

    1. 事件循环机制 1.1. 什么是事件循环 事件循环(Event Loop),即通过轮询方法监控事件; asyn...

  • 探索未知种族之osg类生物---呼吸分解之事件循环一

    事件循环和更新循环 终于到了我们嘴里经常念叨的事件循环、更新循环以及渲染循环了。首先我们来区分一下事件循环和渲染循...

  • 事件循环

    先来一张图 下面上写的代码,在看浏览器的主线程的执行情况 再来上主线程页面初始化加载时的情况 setInterva...

  • 事件循环

    事件触发不会马上执行回调,会加入队列,队列中按照先进先出的顺序,逐个执行事件绑定的回调方法 新事件产生后会插在队尾...

  • 事件循环

    总结:第一次循环先执行宏任务中的队头任务,清空调用栈后执行微任务,然后第二次循环执行宏任务的队头任务,.........

  • 事件循环

    原文链接:https://zhuanlan.zhihu.com/p/26229293最近琢磨了好久的Javascr...

  • 事件循环

    单线程 .JavaScript是单线程javascript是单线程,无论后面加了什么标准,什么操作,都不能改变ja...

  • 事件循环。。

    Node.js 是单进程单线程应用程序,但是通过事件和回调支持并发,所以性能非常高。 Node.js 的每一个 A...

  • 事件循环

网友评论

      本文标题:事件循环

      本文链接:https://www.haomeiwen.com/subject/cigskrtx.html