百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

事件循环机制:JavaScript被设计为单线程,那如何做到异步的呢?

myzbx 2025-01-10 15:41 39 浏览

js是单线程的语言,单线程是指所有的程序路径按照一定的顺序执行,只有前面的程序执行了,后面的程序才会执行。

也就是说在同一时间,js只能做一件事情,为了协调浏览器产生的各种事件、网络处理、前端渲染等行为,js的事件循环机制,即EventLoop应运而生。

JavaScript是单线程的原因

js的设计初衷是作为浏览器的脚本语言,浏览器中涉及到与用户互动、频繁操作DOM等动作,如果js设计为多线程,会有很复杂的线程同步问题,即使同步问题被解决,也会降低浏览器的响应效率,得不偿失,因此,JavaScript被设计为单线程保证浏览器动作的一致性。

事件循环(EventLoop)

JavaScript既然被设计为单线程,是如何做到异步的呢?这时就用到了JavaScript的事件循环机制。

如下图所示为JavaScript事件循环的原理图。

如图所示,事件循环是主线程循环读取任务队列中的任务,直到所有的任务都被执行。在事件循环中,JavaScript用到了栈、堆以及队列等数据结构。

栈中存放的是执行上下文,有函数被调用时,就会创建上下文存放在执行栈中。

堆中表示一个非结构化的内存区域,用来存放对象。队列是指任务队列,用于存放异步任务。

js引擎遇到一个异步事件之后不会一直等待事件的返回结果,而是将事件挂起,继续执行执行栈中的其他任务。

当异步事件返回结果时,js将异步事件callback函数放入队列中,被放入队列中的异步事件不会立即回调,等到当前执行栈中的任务都执行完成,处于闲置状态的主线程按照队列顺序将处于首位事件的callback函数放入执行栈中,执行该函数的同步代码,如果遇到了异步事件,同样也会将其回调函数放入事件队列中......

如此反复,就形成了一个无限循环,这也是被称为“事件循环(EventLoop)”的原因。

宏任务(Micro task)和微任务(Macro task)

js事件循环的基本原理已经描述清楚,但是异步任务之间也有所不同。

上面讲到,js在执行异步任务时,回调函数会被放在js的任务队列中,实际上,回调函数的类别不同,执行的优先级也不同。

不同的优先级被分为两类,一类是宏任务(Micro task),一类是微任务(Macro task)。

回调函数是微任务时,会被放在微任务队列,回调函数是宏任务时,会被放在宏任务队列。微任务的优先级高于宏任务,当主线程的任务执行完成时,会首先去执行微任务队列中首位的回调函数,当微任务队列中为空时,才回去执行宏任务队列中的回调函数。

常见的微任务有:promise,常见的宏任务有setInterval等。

因此,事件循环的执行流程图如下所示:

最后:

1)关注+私信回复:“测试”,可以免费领取一份10G软件测试工程师面试宝典文档资料。以及相对应的视频学习教程免费分享!,其中包括了有基础知识、Linux必备、Mysql数据库、抓包工具、接口测试工具、测试进阶-Python编程、Web自动化测试、APP自动化测试、接口自动化测试、测试高级持续集成、测试架构开发测试框架、性能测试等。

2)关注+私信回复:"入群" 就可以邀请你进入软件测试群学习交流~~

相关推荐

大白话讲nnvm(大白话讲解什么是卷积)

之前工作经验中,在某大厂,开发过机器学习框架,在和业务同学的合作下,取得还可以的成绩,但是一直觉得缺少了什么,最近在刷ai-system相关的公开课,才明白计算图的重要性,以往觉得不能理解的东西,现在...

Python之Json模块详解(python.json()用法)

Step1:Json是什么JSON(JavaScriptObjectNotation,JS对象标记)是一种轻量级的数据交换格式。具有数据格式简单,读写方便易懂等很多优点。许多主流的编程语言都...

最新潮最流行的影音资源——MAU影视

MAO影视,一款完全免费的影视软件,为您带来最新潮最流行的影音资源,软件本身并不具备任何资源,只是作为一款播放器提供给大家。配合相关的接口链接,即可为您呈现丰富多彩的影音节目。软件版本支持:1.安卓2...

Python版的迷你程序——json文件转换为csv

浅话C语言是过去几十年软件和硬件两个阵营之间,签署的最坚实的契约。硬件为C语言的语义提供了最能发挥其性能的基础构件,而软件虽然搞了很多的圆环套圆环般的层次,但最终都以C语言作为最后的沉淀收尾。----...

没硬盘、网盘也能看片自由!NAS一键部署MoonTV,随时随地爽看。

本内容来源于@什么值得买APP,观点仅代表作者本人|作者:羊刀仙有没有一个应用服务,能满足既没有足够预算购置硬盘,也不想依托网盘的朋友的家庭观影需求?之前我介绍过LibreTV,本篇再来看看另一个更...

用云存储30分钟快速搭建APP,你信吗?

背景不管你承认与否,移动互联的时代已经到来,这是一个移动互联的时代,手机已经是当今世界上引领潮流的趋势,大型的全球化企业和中小企业都把APP程序开发纳入到他们的企业发展策略当中。但随着手机APP上传的...

Python的dict和json区别(python中dict的特点)

大家有没有发现,python中的字典类型的数据结构,和我们目前比较流行的web端的json格式,非常类似,几乎有点分不清了。那么这2者的区别是什么呢?首先,从概念上,我们要理解这2者是截然不同的。py...

越晚搞懂 MySQL JSON 数据类型,你就越吃亏

作者介绍陈臣,甲骨文MySQL首席解决方案工程师,公众号《MySQL实战》作者,有大规模的MySQL,Redis,MongoDB,ES的管理和维护经验,擅长MySQL数据库的性能优化及日常操作的原理剖...

揭秘你不会画“信息结构图”的本质

编辑导语:产品信息结构图有助于清晰地展示产品信息,一定程度上可以为后台上传数据提供依据,但不少人可能觉得产品信息结构图很难,这可能是对数据库表结构不理解等因素导致的。本篇文章里,作者就产品信息结构图的...

python之json基本操作(.json python)

1.概述JSON(JavaScriptObjectNotation)是一种轻量级的数据交换格式,它具有简洁、清晰的层次结构,易于阅读和编写,还可以有效的提升网络传输效率。Python标准库的...

JWT 和 JJWT 还傻傻的分不清吗(jwt jti)

JWTs是JSON对象的编码表示。JSON对象由零或多个名称/值对组成,其中名称为字符串,值为任意JSON值。JWT有助于在clear(例如在URL中)发送这样的信息,可以被信任为不可读(即加密的)、...

比json快20-100倍!protobuf原理深入剖析

一、protobuf语法指南1.1定义一个消息类型先来看一个非常简单的例子。假设你想定义一个“搜索请求”的消息格式,每一个请求含有一个查询字符串、你感兴趣的查询结果所在的页数,以及每一页多少条查询结...

了解一下ProtoBuf(了解一下相亲对象的年龄)

序列化与反序列化我们在进行网络通信调用的时候,总是需要将内存的数据块经过序列化,转换成为一种可以通过网络流进行传输的格式。而这种格式在经过了传输之后再经过序列化,能还原成我们预想中的数据结构。那么我们...

JSON数据类型详细总结(json数据类型详细总结怎么写)

JSON详解一、JSON的概述及其使用JSON(JavaScriptObjectNotation)是一种轻量级的数据交换格式。它基于javascript的一个子集。JSON是的数据交换语言,易...

接口自动化测试之JSON Schema模式该如何使用?

JSONSchema模式是一个词汇表,可用于注释和验证JSON文档。在实际工作中,对接口返回值进行断言校验,除了常用字段的断言检测以外,还要对其他字段的类型进行检测。对返回的字段一个个写断言显...