JavaScript中的事件循环(Event Loop)

news2024/9/22 2:29:52

1. 概述

javaScript是单线程的,意味着它一次只能执行一个任务。然而,许多操作,如网络请求、定时器等,都会导致延迟,如果程序在等待这些操作完成时,可能会操作一个阻塞的效果,影响用户体验。这个时候就需要事件循环来进行一个调节:通过合理的安排任务的执行顺序,使得异步任务能够以非阻塞的方式运行。在搞清楚事件循环之前,需要明白javaScript中的任务、任务队列等概念

2. javaScript中的任务

javaScript程序里面的任务可以分为两类

  • 同步任务:没有被引擎挂起、在主线程上排队执行的任务。同步任务是按照代码的书写顺序依次执行的,只有前一个任务执行完毕,才能执行下一个任务,因此会阻塞后续的任务执行。在事件循环中,同步任务的执行会一致持续,直到所有的同步任务执行完毕
  • 异步任务:被引擎挂起、放在一边,不进入主线程,而进入任务队列的任务。异步任务是在将来的某个时间点执行的任务,不会阻塞后续任务的执行,异步任务通常会在一段时间后完成,并在完成时触发回调函数处理结果。 异步任务又可以分为两个子类,宏任务、微任务
    • 宏任务:代表一个独立的、完整的执行单元,在任务队列中排队等待执行。典型的宏任务包括,整体的javaScript代码、setTimeOutsetTimeIntervalAjax
    • 微任务:微任务是一个更小的任务单位,它的执行优先级高于宏任务。当一个宏任务执行完毕后,在执行下一个宏任务之前,会立即处理微任务队列中的所有微任务。典型的微任务包括,promisedefinePropertyProxy

3. 任务队列和事件循环

javaScript运行时,除了一个正在运行的主线程,引擎还提供了一个任务队列(task queue),里面是各种需要当前程序处理的异步任务。实际上根据异步任务的类型,存在多个任务队列,如之前所说的,宏任务队列,微任务队列。

  • 任务队列:是一种数据结构,用于存储不同类型的任务,如宏任务和微任务。任务会别添加到任务队列,等待事件循环将其取出并执行
    • 宏任务队列:存储宏任务,每次事件循环迭代中只执行一个宏任务
    • 微任务队列:存储微任务,这些微任务在宏任务执行完毕之后立即执行

引擎在执行所编写的代码顺序是:

  1. 主线程会去执行所有的同步任务。等到同步任务执行完毕之后,就会检查任务队列里面的异步任务
  2. 这里首先会从宏任务队列里面选择一个宏任务执行,执行完毕之后,则检查微任务队列并以此执行里面所有的微任务
  3. 当微任务队列中的任务执行完毕之后,重复步骤2,直到宏任务队列为空

在每次事件循环迭代中,同步任务的执行都是第一步,只有当所有的同步任务执行完毕之后,事件循环机制才会去检查任务队列,并从宏任务队列中选择一个宏任务执行,在执行宏任务的过程中如果产生了微任务,会将这些微任务添加到微任务队列,并等当前的宏任务执行完毕之后立即执行微任务队列里面的微任务。等微任务队列中的微任务执行完毕之后,则会选着宏任务队列中的下一个宏任务执行,依次循环

在这里插入图片描述

事件循环:上诉执行顺序中的2->3->2->3...就可以称为事件循环(Event Loop), 事件循环是 JavaScript 异步编程的基础机制,通过合理地管理任务队列、宏任务和微任务,使得异步操作能够在单线程环境中得到有效的协调和执行,从而提高了程序的响应性和用户体验。

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

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

相关文章

设计模式之命令模式(Command)的C++实现

1、命令模式的提出 在软件开发过程中,“行为请求者”和“行为实现者”通常呈现一种“紧耦合”,如果行为的实现经常变化,则不利于代码的维护。命令模式可以将行为的请求者和行为的实现者进行解耦。具体流程是将行为请求者封装成一个对象&…

Git企业开发控制理论和实操-从入门到深入(六)|多人协作开发

前言 那么这里博主先安利一些干货满满的专栏了! 首先是博主的高质量博客的汇总,这个专栏里面的博客,都是博主最最用心写的一部分,干货满满,希望对大家有帮助。 高质量博客汇总 然后就是博主最近最花时间的一个专栏…

c语言实现堆

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言一、树1、树的概念2、树的相关概念3、树的表示 二、二叉树1、二叉树概念2、特殊的二叉树3、二叉树的性质4、二叉树的顺序结构5、二叉树的链式结构 三、堆(二叉树…

基于VHDL语言的汽车测速系统设计_kaic

摘 要 汽车是现代交通工具。车速是一项至关重要的指标。既影响着汽车运输的生产率,又关乎着汽车行驶有没有超速违章,还影响着汽车行驶时人们的人身安全。而伴随着我国国民的安全防范意识的逐步增强,人们也开始越来越关心因为汽车的超速而带来的极其严重…

2005-2022年全国各地级市经济增长目标约束

2005-2022年全国各地级市经济增长目标约束 1、时间:2005-2022年 2、来源:政府工作报告 3、指标:省份、城市、年份、经济增长目标硬约束、经济增长目标软约束 4、范围:地级市,每年具体城市数量参看下面图片 5、指标…

C语言_通过函数调用改变指针参数的指向

C语言_通过函数调用改变指针参数的指向 函数的参数为指针类型,对一般指针参数执行间接访问操作是允许函数修改原先的数组元素的,但是函数所接收到的参数是原参数的一份拷贝,所以函数对参数进行操作而不会影响实际的参数,就是说正常…

深度学习在自然语言处理中的十大应用领域

文章目录 1. 机器翻译2. 文本分类3. 命名实体识别4. 问答系统5. 文本生成6. 情感分析7. 语言生成与处理8. 信息检索与摘要9. 文本纠错与修复10. 智能对话系统总结 🎉欢迎来到AIGC人工智能专栏~深度学习在自然语言处理中的十大应用领域 ☆* o(≧▽≦)o *☆嗨~我是IT陈…

CausalEGM:通过编码生成建模的通用因果推理框架

英文题目:CausalEGM: a general causal inference framework by encoding generative modeling 中文题目:CausalEGM:通过编码生成建模的通用因果推理框架 单位:斯坦福大学统计系 时间:2023 论文链接:ht…

聚类分析 | MATLAB实现基于AHC聚类算法可视化

聚类分析 | MATLAB实现基于AHC聚类算法可视化 目录 聚类分析 | MATLAB实现基于AHC聚类算法可视化效果一览基本介绍程序设计参考资料 效果一览 基本介绍 AHC聚类算法,聚类结果可视化,MATLAB程序。 Agglomerative Hierarchical Clustering(自底…

Git企业开发控制理论和实操-从入门到深入(七)|企业级开发模型

前言 那么这里博主先安利一些干货满满的专栏了! 首先是博主的高质量博客的汇总,这个专栏里面的博客,都是博主最最用心写的一部分,干货满满,希望对大家有帮助。 高质量博客汇总 然后就是博主最近最花时间的一个专栏…

数据结构】二叉树篇|超清晰图解和详解:后序篇

博主简介:努力学习的22级计算机科学与技术本科生一枚🌸博主主页: 是瑶瑶子啦每日一言🌼: 你不能要求一片海洋,没有风暴,那不是海洋,是泥塘——毕淑敏 目录 一、核心二、题目 一、核心 我们清楚…

UML四大关系

文章目录 引言UML的定义和作用UML四大关系的重要性和应用场景关联关系继承关系聚合关系组合关系 UML四大关系的进一步讨论UML四大关系的实际应用软件开发中的应用其他领域的应用 总结 引言 在软件开发中,统一建模语言(Unified Modeling Language&#x…

飞桨中的李宏毅课程中的第一个项目——PM2.5的预测

所谓的激活函数,就是李宏毅老师讲到的sigmoid函数 和 hard sigmoid函数 ,ReLU函数那些 现在一点点慢慢探索,会成为日后想都做不到的经历,当你啥也不会的时候,才是慢慢享受探索的过程。 有一说一,用chatGP…

观察级水下机器人使用系列之六超短基线(下)

本文主要讲述超短基线的安装校准和应用。 1、安装校准概述 水下声学导航系统标定算法的准确性很大程度上取决于所采集的数据质量、超短基线基阵的几何结构、高效的数值计算算法等方面。Mc Ewen 等在 2005 年发现了对于分立式的超短基线系统,水声传感器与姿态传感器…

数据结构--树4.2(二叉树)

目录 一、二叉树的定义和特点 1、定义 2、特点 二、二叉树的基本形态 1、空二叉树 2、只有一个根结点 3、根结点只有左子树 4、根结点只有右子树 5、根结点既有左子树又有右子树 6、斜树 7、满二叉树 8、满二叉树和完全二叉树 三、二叉树的性质 一、二叉树的定义和…

2. 使用IDEA创建Spring Boot Hello项目并管理依赖——Maven入门指南

前言:本文将介绍如何使用IDEA创建一个Spring Boot Hello项目,并通过Maven来管理项目的依赖。我们从项目的创建到代码的编写,再到项目的构建和运行,一步步演示了整个过程。 🚀 作者简介:作为某云服务提供商的…

LeetCode-738-单调递增的数字

题目描述&#xff1a; 当且仅当每个相邻位数上的数字 x 和 y 满足 x < y 时&#xff0c;我们称这个整数是单调递增的。 给定一个整数 n &#xff0c;返回 小于或等于 n 的最大数字&#xff0c;且数字呈 单调递增 。 解题思路&#xff1a; 先将int变成char[]&#xff0c;获取…

86. 分隔链表(中等系列)

给你一个链表的头节点 head 和一个特定值 x &#xff0c;请你对链表进行分隔&#xff0c;使得所有 小于 x 的节点都出现在 大于或等于 x 的节点之前。 你应当 保留 两个分区中每个节点的初始相对位置。 示例 1&#xff1a; 输入&#xff1a;head [1,4,3,2,5,2], x 3 输出&…

webassembly004 ggml wasm_eval 与js代码交互 调试

试用 $:~/ggml/ggml$cd examples/mnist $:~/ggml/ggml/examples/mnist$ emcc -I../../include -I../../include/ggml -I../../examples ../../src/ggml.c main.cpp -o web/mnist.js -s EXPORTED_FUNCTIONS["_wasm_eval","_wasm_random_digit","_mall…

Linux设备驱动之多个同类设备共用一套驱动

1. 应用场景 比如我们的设备上有很多一样的usb接口&#xff0c;这些usb接口都需要有驱动才能工作&#xff0c;那么是每个usb都一套单独的驱动程序么&#xff1f;显然不是的&#xff0c;这些usb接口属于同一类设备&#xff0c;用户对他们的操作方法完全一致&#xff0c;只不过不…