15.3 event loop 事件循环

news2024/11/10 13:01:19

event loop 事件循环

start

  • 最近这段时间一直在研究 javascript 中的事件循环,看了不少相关视频和文章。
  • 学习完知识后,虽然对 javascript 的代码执行顺序,能够正确判断。但是当我想将理论知识用自己口头语言表达出来的时候,发现有点困难。
  • 随即想写个文章梳理梳理。

1. javascript 是单线程的

首先我们知道 javascript 是单线程的

单线程就意味着,所有任务需要排队,前一个任务结束,才会执行后一个任务。如果前一个任务耗时很长,后一个任务就不得不一直等着。

如果排队是因为计算量大,CPU 忙不过来,倒也算了,但是很多时候 CPU 是闲着的,因为 IO 设备(输入输出设备)很慢(比如 Ajax 操作从网络读取数据),不得不等着结果出来,再往下执行。

2.同步,异步任务

由于上面讲述到的问题,随即有同步和异步这两个概念来解决上述的问题。

  • 同步任务指的是,在主线程上排队执行的任务,只有前一个任务执行完毕,才能执行后一个任务;
  • 异步任务指的是,不进入主线程、而进入"任务队列"(task queue)的任务,只有"任务队列"通知主线程,某个异步任务可以执行了,该任务才会进入主线程执行

3.执行逻辑

(1)所有同步任务都在主线程上执行,形成一个执行栈(execution context stack)。

(2)主线程之外,还存在一个"任务队列"(task queue)。只要异步任务有了运行结果,就在"任务队列"之中放置一个事件。

(3)一旦"执行栈"中的所有同步任务执行完毕,系统就会读取"任务队列",看看里面有哪些事件。那些对应的异步任务,于是结束等待状态,进入执行栈,开始执行。

(4)主线程不断重复上面的第三步。

4.event loop

主线程从"任务队列"中读取事件,这个过程是循环不断的,所以整个的这种运行机制又称为 Event Loop(事件循环)。

简单来书:JS 只有一个主线程,主线程执行完执行栈的任务后去检查异步的任务队列,如果异步事件触发,则将其加到主线程的执行栈。

5.加深理解事件循环

在这里插入图片描述

对照上述的截图,我来说说我的理解。

个人理解,若表达有误,欢迎指出。

  1. 上图的左上角,有一个包含V8图标的区域,简称区域A。这个区域可以理解为,执行 JS 代码的线程所在区域。JS是单线程的,这个单线程指的就是这个线程。

  2. 在执行代码的过程中,遇到同步的任务,会按照代码执行顺序,将任务在区域A中的 stack 压入压出。

    stack可以理解为是一个数组,可以用于存储,遵循后进先出的规则。

  3. 在执行代码的过程中,遇到异步任务,会调用对应的WebApi。例如上图中的 1.元素上的事件2.XMLHttpRequest;3.setTimeout

    WebApi由浏览器提供,当然运行这些API的是浏览器中的其他线程。

  4. 当异步任务执行完毕后,会将它们的回调函数存放在 callback queue (回调队列/任务队列)中。

    这个队列,简单理解,就是一个存储数据的地方,它和stack不一样的是,它遵循先进先出的规则。

  5. 执行 JS 代码的线程的任务执行完毕,也就是stack中的任务执行完毕,就会从callback queue 中读取事件(回调函数)。

    • 每次读取一个;
    • 多个回调函数,则会循环读取;(也就是所说到的事件循环)
    • 执行 JS 代码的线程从"任务队列"中读取事件,这个过程是循环不断的,所以整个的这种运行机制又称为 Event Loop(事件循环)。
  6. 执行 JS 代码的线程读取了事件,会存放到 stack ,然后按顺序执行,当 stack 中的任务执行完毕,会继续读取 callback queue中的事件。如此循环下去

6.对自己的提问

6.1 什么叫做事件循环?

执行JS的主线程任务执行完毕,会循环读取事件队列中的事件,叫做事件循环。

6.2 为什么JS单线程,却能通过异步同时执行多个任务?

执行JS的是单线程不假,但是异步操作,可借用宿主环境(浏览器)提供的WebApi,启动对应的线程进行工作,例如网络请求,文件读取。

我理解异步本质上,其实是借用了宿主环境的线程,达到同时执行多个任务。

看过一个讲解事件循环的演讲,让我印象很深刻,他说他查看了浏览器的V8引擎源代码,发现在引擎源码中并没有定时器的相关代码。定时器,其是宿主环境提供的API。

按照这个说法,我理解到,怪不得 axios 中封装网络请求,浏览器中使用XMLHttpRequest,NodeJs环境中使用http模块。

因为网络请求和定时器类似,本身就是宿主环境提供的支持。所以分别进行单独处理。

7.其他

番茄在写这篇文章的时候,看到了另一篇文章,该文章记录了和 ChatGPT (最近比较火智能 AI)的聊天记录。

文章中问 AI 这么一个问题,让我印象深刻。我这里记录一下。

问:Javascript 执行机制?

A: JavaScript 执行机制是基于事件循环的单线程模型,它会按照代码的顺序执行,遇到异步操作时会将其放入任务队列中,等待主线程空闲时再执行。

end

  • 对于事件循环,就整理到这里。
  • 下文说说,宏任务和微任务。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/139140.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

函数 ~~~

函数 目录:函数函数概述函数类型函数定于与声明函数参数引用函数可变函数函数可变参数 使用函数默认参数函数返回值函数嵌套调用函数递归内联函数内联函数与普通函数区别函数重载函数概述 C语言中的函数在其他编程语言中也称为过程或子例程。 我们可以创建函数来执…

小游戏引擎选型注意事项

写在前面 前面写了几期有关于小游戏的文章,主要从小游戏开发、小游戏运营、小游戏变现等多个角度进行了较为粗略的介绍,很多同学表示对小游戏引擎部分很感兴趣,希望能够有一些更为深入的分析介绍。今天就对目前主流的小游戏引擎进行探讨。 …

短短一年,市值抹去三分之一 跌落高坛的苹果

美东时间1月3日(周二),苹果(AAPL)收报125.07美元,跌幅3.74%,市值降至1.99万亿美元,2万亿美元市值俱乐部中的最后一家就此陨落。此前微软和石油巨头…

电影《绝望主夫》观后感

上周的时候,看了开心麻花的电影《绝望主夫》,讲的是一对夫妇整个世界对换的故事,即丈夫整个继承了妻子世界,妻子继承了丈夫世界观,这确实给人了一种新的视角,一个对调视角。 记得以前刷视频的时候&#xff…

算法之回溯算法

目录 前言 如何理解回溯算法 两种回溯算法的经典应用 1.0-1背包 2.正则表达式 总结 参考资料 前言 很多经典的数学问题都可以用回溯算法解决,比如数独、八皇后、0-1 背包、图的着色、旅行商问题、全排列等等。用来指导像深度优先收索这种经典的算法。 如何理…

2021 CCF “计算之美”学术大会参会总结

最近在回顾读研以来参加过的大大小小的学术会议记录,在此整理记录之。 前言 2021年6月12日,2021年CCF“计算之美”——新基建时代产、教、研、地融合学术大会在海上丝绸之路起点宁波成功举办。近200人参与本次大会,40余位嘉宾带来精彩分享&…

pwr | 谁说样本量计算是个老大难问题!?(三)(配对样本与非等比样本篇)

1写在前面 之前我们介绍的基于发生率或者均值进行样本量计算的方法,但都是在组间进行计算。🤔 有的时候我们需要获取组内变化,进行样本量计算。🤫 常见的就是配对样本,比如相同受试者进行多个时间点的观察,…

Navicat远程连接禅道一键安装在Linux的MySQL数据库

禅道一键安装的数据库,默认只能在服务器本机访问。远程访问须进行配置,本文说明具体的配置方法,并且已经过验证。 1、首先检查对应的端口是否开放,默认端口为3306. 2、连接到禅道自带的网页版数据库 3、执行SQL创建一个新角色 …

外贸人需要知道的销售技巧有哪些?

外贸销售技巧米贸搜整理如下,希望对你有所帮助:第一步:准备好。没有准备意味着为失败做准备,没有计划意味着为破产做打算。这是为什么呢?因为你不知道你这次要谈什么,所以你首先要做的是准备好整个谈话的结果。第一,我…

PDF能转换成PPT吗?该怎样转换?

PDF能转换成PPT吗?当然是可以的啦!我们在工作时候经常需要将PDF文件转换成各种格式的文件,这样可以更方便我们处理各种文件,PPT文件可以用来汇报、展示工作内容等,是我们经常使用的文件类型之一,所以有时候…

Linux文件描述符fd详解重定向原理

文章目录什么是文件描述符fd&#xff1f;文件描述符的分配规则重定向的原理什么是文件描述符fd&#xff1f; #include <stdio.h> #include <stdlib.h> #include <string.h> #include <unistd.h> #include <sys/types.h> #include <sys/stat.…

AppScan 是一款web安全扫描工具

AppScan介绍&#xff1a; AppScan是IBM的一款web安全扫描工具&#xff0c;主要适用于Windows系统。该软件内置强大的扫描引擎&#xff0c;可以测试和评估Web服务和应用程序的风险检查&#xff0c;根据网站入口自动对网页链接进行安全扫描&#xff0c;扫描之后会提供扫描报告和修…

2022 中国白帽人才能力与发展状况调研报告

声明 本文是学习2022中国白帽人才能力与发展状况调研报告. 下载地址 http://github5.com/view/55039而整理的学习笔记,分享出来希望更多人受益,如果存在侵权请及时联系我们 中国白帽人才能力与发展状况调研报告 2022.11 补天漏洞响应平台 奇安信行业安全研究中心 概述 …

元数据管理Datahub架构讲解

目录1. 概述2. 各模块介绍2.1 Metadata Store​2.2 Metadata Models2.3 Ingestion Framework2.4 GraphQL API2.5 User Interface3. Ingestion Framework的架构3.1 Metadata Change Event(MCE)3.2 Pull-based Integration3.3 Push-based Integration​3.4 Applier(mce-consumer)…

CAN学习资料汇总

先简单做个汇总&#xff0c;细节稍后再逐一写出来 CAN&#xff0c;CANOpen与OSI七层协议的关系 CAN CAN是控制器局域网络(Controller Area Network, CAN)的简称&#xff0c;是由以研发和生产汽车电子产品著称的德国BOSCH公司开发的&#xff0c;并最终成为国际标准&#xff08;…

暴涨1000w播放!B站爆款恰饭,弹幕刷屏“上链接”

12月27日&#xff0c;在2022 AD TALK bilibili营销伙伴大会上李旎谈到B站第一批主流用户大多数已经进入28-30岁的阶段&#xff0c;近亿的用户开始对内容的需求有了新的变化。除此之外&#xff0c;B站近几年的用户增长速度亮眼&#xff0c;2022年第三季财报显示平台日活用户已经…

动态内存管理(15)

目录 1、动态内存函数的介绍 1、malloc 2、free 3、calloc 4、realloc 2、常见的动态内存错误 3、C/C程序的内存开辟 4、柔性数组 1、定义 2、柔性数组的特点&#xff1a; 3、使用 1、动态内存函数的介绍 1、malloc malloc 向堆区申请一块连续可用的空间&#xff…

【高阶数据结构】AVL树(动图详解)

&#x1f308;欢迎来到数据结构专栏~~AVL树详解 (꒪ꇴ꒪(꒪ꇴ꒪ )&#x1f423;,我是Scort目前状态&#xff1a;大三非科班啃C中&#x1f30d;博客主页&#xff1a;张小姐的猫~江湖背景快上车&#x1f698;&#xff0c;握好方向盘跟我有一起打天下嘞&#xff01;送给自己的一句…

5G NR 标准 第12章 波束管理

第12章 波束管理 第 11 章一般性地讨论了多天线传输&#xff0c;然后重点介绍了多天线预编码。 讨论多天线预编码的一般假设是可以对不同的天线元件进行详细控制&#xff0c;包括相位调整和幅度缩放。 实际上&#xff0c;这需要在数模转换之前在数字域中执行发射机侧的多天线…

path 路径模块

1、什么是 path 路径模块 path 模块是 Node.js 官方提供的、用来处理路径的模块。它提供了一系列的方法和属性&#xff0c;用来满足用户对路径的处理需求。 方法名 说明 path.join() 用来将多个路径片段拼接成一个完整的路径字符串 path.basename() 用来从路径字符串中…