JavaScript事件循环及任务处理

news2024/12/27 15:10:58

JavaScript事件循环及任务处理##

浏览器中 JavaScript 的执行流程和 Node.js 中的流程都是基于 事件循环 的。
理解事件循环的工作方式对于代码优化、性能优化很重要,有时对于正确的架构也很重要。
我们首先介绍事件循环工作方式的理论细节,然后介绍该知识的实际应用。

1. 事件循环

事件循环 的概念非常简单。它是一个在 JavaScript 引擎等待任务,执行任务和进入休眠状态等待更多任务这几个状态之间转换的无限循环。
在这里插入图片描述
引擎的一般算法:
1.当有任务时:从最先进入的任务开始执行。
2.休眠直到出现任务,然后转到第 1 步。

当我们浏览一个网页时就是上述这种形式。JavaScript 引擎大多数时候不执行任何操作,它仅在脚本/处理程序/事件激活时执行。

比如,我们操作网页的时候都会产生哪些任务

  • 外部脚本加载完成时,任务就是执行脚本
  • 用户移动鼠标时,任务就是派生出的mousemove事件和事件处理程序
  • 当定时器setTimeout时间到达时,任务就是执行回调
  • 当Promise.then响应时,任务就是执行回到函数
  • 等等类似任务

当然,处理引擎不总是这么空闲能够及时处理这些任务,那有人就会问了,那这个情况该怎么办?
那当然是进行排队了,采用 先进先出 的原则进行排队,然后等待事件队列的处理,也就是开头那张图的处理机制,直至所有任务处理完成,处理引擎就会进入到休眠状态等待新的任务到来。

2. 宏观任务和微观任务(MACRO TASK AND MICRO TASK)

Js 中,有两类任务队列:宏任务队列(macro tasks)和微任务队列(micro tasks)。宏任务队列可以有多个,微任务队列只有一个。那么什么任务,会分到哪个队列呢?

  • 宏任务:script(全局任务), setTimeout, setInterval, setImmediate, I/O, UI rendering.
  • 微任务:process.nextTick, Promise, Object.observer, MutationObserver.

微任务始终先于宏任务执行。

宏任务和微任务的一些演示可以参考我这个文章 微任务和宏任务的区别及具体场景

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

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

相关文章

【数据库】MySQL数据库基础

目录 1.数据库: 2.数据库基本操作 2.1 MySQL的运行原理 2.2显示数据库: 2.3创建数据库 2.4使用数据库 2.5删除数据库 3.常见的数据类型 3.1数值类型: 3.2字符型类型 3.3日期类型 4.表的操作 4.1创建表 4.2查看表 4.3删除表 5.汇总…

【蓝桥杯PythonB组备赛】【Acwing周赛】第93场 4867. 整除数 4868. 数字替换 python解

目录 A AcWing 4867. 整除数 1.题目描述 2.思路分析 3.代码实现 B AcWing 4868. 数字替换 1.题目描述 2.思路分析 3.代码实现 A AcWing 4867. 整除数 1.题目描述 2.思路分析 为什么不能直接暴力? 数据:1 ≤ n, k ≤ 10 ** 9 1s内最多…

openpnp - 设备开机后, 吸嘴校验失败的解决方法

文章目录openpnp - 设备开机后, 吸嘴校验失败的解决方法概述重新校验吸嘴ENDopenpnp - 设备开机后, 吸嘴校验失败的解决方法 概述 设备开机后, 默认会校验吸嘴座上已经安装的2个吸嘴. 如果开机校验吸嘴失败, 就需要用向导重新校验失败的吸嘴. 具体是哪个吸嘴校验失败, 可以看…

C++的双端队列

双端队列介绍1.双端队列知识需知2.大试牛刀1.双端队列知识需知 由于队列是一种先进先出(FIFO)的数据结构,因此无法直接从队列的底部删除元素。如果希望从队列的底部删除元素,可以考虑使用双端队列(deque)。…

SpringCloud:Ribbon

目录 SpringCloud:Ribbon 1、负载均衡原理 2、负载均衡策略 3、饥饿加载 SpringCloud:Ribbon 1、负载均衡原理 2、负载均衡策略 Ribbon的负载均衡规则是一个叫做IRule的接口来定义的,每一个子接口都是一种规则; 内置负载均衡celue规则描…

2023年“网络安全”赛项江苏省淮安市选拔赛 任务书

任务书 一、竞赛时间 共计3小时。 二、竞赛阶段 竞赛阶段 任务阶段 竞赛任务 竞赛时间 分值 第一阶段单兵模式系统渗透测试 任务一 服务器内部信息获取 任务二 网站渗透测试 任务三 Linux系统渗透提权 任务四 Web渗透测试 第二阶段分组对抗 备战阶段 攻防对抗准备工作 系统加…

python+嵌入式——串口通信篇(收发解包)

目录前言安装pyserialpyserial大致概括整体流程硬件连接例子(简单版)详细使用serial初始化参数发包收包收包检查包并解包python struct模块结语前言 这几年,自己也做了一些嵌入式机器人。在整个开发的过程中,调通信通常会花费一段比较长的时间&#xff…

Docker是什么,怎么用?

1、docker解决了什么的问题? Docker是属于运维和持续集成的管理工具,特别是在运维方面使用Docker可以让你省去很多重复的工作,可以让你的应用程序永远都是在相同的环境中运行。 统一标准 ● 应用构建 ○ Java、C、JavaScript ○ 打成软件包 …

【刷题笔记】之二分查找(搜索插入位置。在排序数组中查找元素的第一个和最后一个位置、x的平方根、有效的完全平方数)

1. 二分查找题目链接 704. 二分查找 - 力扣(LeetCode)给定一个 n 个元素有序的(升序)整型数组 nums 和一个目标值 target ,写一个函数搜索 nums 中的 target,如果目标值存在返回下标,否则返回 -…

《Linux运维实战:Mysql8.0.30安装及卸载component_validate_password插件》

一、背景 由于业务系统的特殊性,我们需要将MySQL8.0.30主从复制集群部署在客户机房服务器上,且客户对数据库的密码策略要求比较高。 因为官方的8.0.30版本的Docker镜像默认是没有安装validate_password插件的,所以我在主从复制集群安装完成后…

minGW-w64配置途径

文章目录1 GNU、GCC与minGW2 minGW当前下载方式3 minGW-w64配置途径Step1Step2Step31 GNU、GCC与minGW GNU这个名字是GNUs Not Unix的递归首字母缩写,它的发音为[gnoo],只有一个音节,发音很像"grew",但需要把其中的r音替…

aws apigateway 基础概念和入门示例

参考资料 https://docs.aws.amazon.com/zh_cn/apigateway/latest/developerguide/getting-started.html apigateway基础理解 apigateway的核心概念 apigateway,基础服务用来管理接口的创建,部署和管理restapi,http资源和方法的集合&#…

【LeetCode】1599. 经营摩天轮的最大利润

1599. 经营摩天轮的最大利润 题目描述 你正在经营一座摩天轮,该摩天轮共有 4 个座舱 ,每个座舱 最多可以容纳 4 位游客 。你可以 逆时针 轮转座舱,但每次轮转都需要支付一定的运行成本 runningCost 。摩天轮每次轮转都恰好转动 1 / 4 周。 …

7 Seata简介

Seata-Server安装 分布式事务解决方案 2PC即两阶段提交协议,是将整个事务流程分为两个阶段,P是指准备阶段,C是指提交阶段。 1. 准备阶段(Prepare phase) 2. 提交阶段(commit phase)举例&…

模电基础(2)半导体二极管

1.二极管的组成二极管:将PN结封装起来,引出两个电极就构成了半导体二极管。二极管的常见结构包括:点接触型(图a),面接触型(图b),平面型(图c)。 点…

世界顶级五大女程序媛,不仅技术强还都是美女

文章目录1.计算机程序创始人:勒芙蕾丝伯爵夫人2.首位获得图灵奖的女性:法兰艾伦3.谷歌经典首页守护神:玛丽莎梅耶尔4.COBOL之母:葛丽丝穆雷霍普5.史上最强游戏程序媛-余国荔说起程序员的话,人们想到的都会是哪些理工科…

java基础-标识符命名规范和数据类型

标识符 1.什么是标识符? Java中变量、方法、类等要素命名时使用的字符序列,称为标识符。 技巧:凡是自己可以起名字的地方都叫标识符。比如:类名、方法名、变量名、包名、常量名等 2.标识符的命名规则 1.标识符由26个英文字母大小…

LQB手打,18B20读取温度,放大一百倍

https://blog.csdn.net/qq_45225613/article/details/110303632?ops_request_misc%257B%2522request%255Fid%2522%253A%2522167798888716800215065334%2522%252C%2522scm%2522%253A%252220140713.130102334…%2522%257D&request_id167798888716800215065334&biz_id0&a…

RCNN

1.RCNN 1.1算法流程 一张图像生成1k~2k个候选区域(使用Selective Search方法)对每个候选区域,使用深度网络提取特征特征送入每一类的SVM分类器,判断是否属于该类使用回归器精细修正候选框位置 1.候选区域的生成 利用selective Search算法通过图像分割的方…

【erlang】入门篇

欢迎入坑Erlang,关键字: 函数式,高并发,容错,热更新,分布式 安装 erlang的安装非常简单,直接去官网下载编译好的二进制安装包即可。需要注意的是文件名格式是OTP_平台_版本.后缀,其…