什么是javaScript的EventLoop(事件循环)?EventLoop采用何种机制进行循环,用于解决什么?

详解JavaScript的运行机制:Event Loop(事件轮询机制) 前言 有人称Event Loop为事件循环机制,而我更愿意将其解释为事件轮询机制,在之后的内容中你会感受到这一点的区别在哪里。说是事件轮询机制,我们也可以说是任务轮询机制,因为英文是Event Loop,所以我们在此文中将其翻译为事件轮询。 阅读本文之前,首先对JavaScript的单线程和异步要有一定的了解,对此不了解的可以先阅读一下我的另一篇博文《JavaScript的单线程和异步》。 在讲J... 阅读详情

一、什么是EventLoop?

诚如翻译,eventloop就是事件循环,那么javascript究竟为何要采取这种方式进行事件的捕捉循环呢?这同样的使我们值得思考的一个问题。

1.1、javaScript是单线程。

首先我们必须要知道为什么javascript是单线程,在这里同样 阮一峰大神给我们讲解的很清楚 参考 阮一峰:JavaScript 运行机制详解:再谈Event Loop javascript因为什么而是一个单线程的语言呢?我们要了解 从web角度来讲 javascript是基于浏览器去运行的一个语言,而浏览器又是一个面向用户的语言,那么比对用户 我们不得不考虑的一个问题就是:
一个用户在同一时间只能做一件事情,他是不能去做两件事情的,而多线程的理念是什么,就是说在同一时间去干多种不同的事情。但是浏览器缺不行,因为不能说我利用多线程一个线程去干add增加操作,一个线程去做delete删除操作。首先这样去想就是不对的。
包括html5推出的Web Worker,允许创建多个线程,但是其根本上还是不能去操作节点的。

1.2、javaScript的同步、异步理念。

什么是同步?什么是异步?简单的来说:

声明一个变量 执行一个运算就是一个同步

执行一个计时器函数,ajax请求就是一个异步

为什么要有同步异步这个东西?

防止阻塞,而对应的JavaScript就是一个非阻塞的语言,我们试想一下,当去进行一个ajax请求时如果JavaScript是一个同步语言,没有异步这个概念的话,对应如果数据量很庞大,用户等待服务器返还时间需要多久呢?

我们不用过多的去思考同步异步这个问题,简单的来说需要时间去执行的就是异步任务在下方我们也会一一列出。

1.3、浏览器的事件循环(EventLoop)。

执行栈和事件队列

执行栈: 同步代码的执行,按照顺序添加到执行栈中。

事件队列: 异步代码的执行,遇到异步行为不会直接返还执行结果,而是将这个事件行为挂起(注意:挂起的同时也是在运行的),继续向下执行执行栈中的任务。当异步事件返回结果,将它放到事件队列中,被放入事件队列不会立刻执行起回调,而是等待当前执行栈中所有任务都执行完毕,主线程空闲状态,主线程会去查找事件队列中是否有任务,如果有,则取出排在第一位的事件,并把这个事件对应的回调放到执行栈中,然后执行其中的同步代码,当然的如果内部有异步代码,继续的会依照事件队列的执行顺序在执行一遍。

看下图 转自 JavaScript中的Event Loop(事件循环)机制
在这里插入图片描述

1.4、异步任务的宏任务、微任务。

宏任务:setTimeout、setInterval等。
微任务:promise、async等。

首先我们要知道为什么要区分异步任务?因为我们要区分优先级
微任务的优先级>宏任务的优先级

为什么?首先我们要知道一个点就是栈的执行机制是先进后出的,但是我们有时不免要出现插队的情况(高优先级先执行,是执行而不是返还先执行不意味着先返还,这个点很重要,不要理解错误。)

在这里也是补充下,下面这张图是没有对同步任务操作进行进栈出栈操作的,但是我们要知道,同步代码执行后,也是会立刻进入到执行栈当中,并且立刻出栈这样一个概念的。(主要也是以下原因:异步任务又分为宏任务和微任务,宏、微任务都是队列,而不是立刻入栈。微、宏任务都会各自创建一个队列,而主线程执行完以后,会优先执行微任务,把微任务全部放到执行栈中执行,最后再从宏任务中取出一个放入执行栈进行执行,执行完后,再取一个,直到执行完所有的宏任务。)所以说同步任务是优先于异步任务去在栈中执行的,因为本身执行栈是一个栈,但同步代码就又马上执行,所以会出现入栈后立即出战的这样一个机制,从而也不会出现同步代码压栈的情况。

一张图带你快速理解宏任务和微任务在任务队列中的区别 转自 深入理解js事件循环机制(浏览器篇):
在这里插入图片描述

总结:EventLoop究竟是什么,用于解决什么的?

Event Loop 是一个很重要的概念,指的也就是计算机系统的一种运行机制。JavaScript语言就采用这种机制,来解决单线程运行带来的一些问题。

前端面试:JS中的Event Loop(事件循环)机制 阅读详情

相关推荐

【JS高阶】定时器、线程进程、事件循环EventLoop(/回流重绘)、Promise

1.宏任务(从上到下、从左到右的整体)2.微任务的Event Queue(Promise.then,async / await整体,process.nextTick【node环境】)3.宏任务的Event Queue(setTimeout / setInterval / setImmediate【node环境】)4.同一轮微任务队列中,依次顺序执行 process.nextTick 、queueMicrotask、Promise.then和async/await5.同一轮宏任务队列。

weixin_45179978的博客 912

事件循环 eventloop

进程 线程 CPU 分配资源的最小单位是进程,同一个时间内单个 CPU 只能运行一个进程,单个 CPU 一次只能运行一个任务 CPU 调度的最小单位是线程,一个进程里面包含多个线程。 可以看看阮老师的这篇文章,进程与线程的一个简单解释 浏览器的进程 浏览器主进程 负责界面展示,用户交互,子进程管理,文件存取等 插件进程 GPU 进程 3d绘制 网络进程 渲染进程 主要负责将 HTML, CSS, JavaScript 转换为用户可交互的网页,排版引擎 Blink 和 JavaScript

Hiraku_Ma的博客 982

Cadence Allegro实战:如何精准导入结构DXF文件避免安装偏差(附图层配置技巧)

本文详细讲解了在Cadence Allegro中精准导入结构DXF文件以避免安装偏差的实战技巧。核心在于导入前的单位校准、创建专用图层结构,以及基于坐标基准点的精确对齐方法。文章还分享了将DXF图形转化为正式板框和禁布区、高效管理图层以及向结构工程师导出DXF的完整流程,帮助PCB工程师确保设计与机械结构完美契合。

1a2s3d4f5g的博客 506

JavaScript的运行机制

JavaScript的运行机制

m0_47584501的博客 3862

2025 高效抓取雪球社区数据:自动化导出Excel与PDF全攻略

本文详细介绍了2025年高效自动化抓取雪球社区数据的完整方案。通过Python脚本,用户可自动抓取帖子列表数据并导出为结构化的Excel表格,同时批量将帖子内容保存为PDF文档,并支持合并与添加书签,极大提升投资研究和信息整理的效率。

weixin_29034963的博客 693

从零配置华为S5720交换机VLAN:Web界面与命令行双模式详解(附拓扑图)

本文详细解析华为S5720交换机VLAN配置的全过程,涵盖Web界面与命令行(CLI)双模式操作指南。从基础环境准备到多交换机环境配置同步,特别针对S5720-52X系列交换机的VLANif接口、端口分配策略及交换机堆叠技术进行深入讲解,并附实用拓扑图与配置示例,助力企业网络管理员高效完成VLAN部署。

happy2的博客 1370

【Promise】阮一峰JavaScript教程-7-异步操作

JavaScript是单线程模型,只在一个线程上运行。JavaScript引擎有多个线程,单个脚本只能在一个线程上运行。为避免复杂性,JavaScript一开始就是单线程,将来也不会改变。优点:实现起来比较简单,执行环境相对单纯,缺点:只要有一个任务耗时很长,后面的任务就得排队等着,会拖延整个程序的执行。JavaScript语言本身不慢,慢的是读写外部数据,比如等待Ajax请求返回结果。Promise对象是JavaScript的异步操作解决方案,为异步操作提供统一接口。

qq_37581764的博客 1716

告别Quartus II的漫长等待:用VSCode+iverilog+GTKWave搭建你的轻量级Verilog仿真环境(2024保姆级教程)

本文详细介绍了如何利用VSCode、iverilog和GTKWave构建高效的Verilog/SystemVerilog开发环境,替代传统的Quartus II和ModelSim工具。通过2024年最新的保姆级教程,帮助开发者实现秒级启动、低资源消耗的轻量级仿真环境,显著提升数字电路设计的开发效率和调试体验。

weixin_33690963的博客 561

浏览器Event Loop机制-宏任务与微任务

前言 阮一峰一篇文章讲过,Event Loop 是在程序中设置两个线程:一个负责程序本身的运行,称为"主线程";另一个负责主线程与其他进程(主要是各种I/O操作)的通信,被称为"Event Loop线程"。这也是解释js即使是单线程的,但如果运用好他的Event Loop机制,开发的程序依然能够提供很好的体验效果。 任务分类 如下图左边是宏任务分类,右边是微任务分类。 代码 console.log("start"); setTimeout(() => { console.log("setTim

weixin_43822182的博客 999

解决TextMeshPro在AB打包中的字体冗余问题:源码修改全记录

本文详细介绍了如何解决TextMeshPro在AB打包中的字体冗余问题,通过源码改造和工程实践优化Unity项目的性能。内容包括资源加载路径重构、AB打包策略优化及运行时加载方案,有效减少包体体积和构建时间,提升内存效率。

weixin_42558257的博客 185

YOLOv11改进策略【卷积层】| CVPR-2023 部分卷积 PConv 轻量化卷积,降低内存占用

本文记录的是利用优化的目标检测方法研究。深度可分离卷积可以减少FLOPs,但会导致更高的内存访问,引起延迟并减慢整体计算。部分卷积利用逐点卷积处理通道冗余,减少模型计算量和内存访问量。Run, Don’t Walk: Chasing Higher FLOPS for Faster Neural Networks的实现代码如下: 四、创新模块 4.1 改进点⭐ 模块改进方法: 1️⃣ 加入。添加后如下:2️⃣:加入基于的。利用改进模块,减少通道冗余。改进代码如下:首先添加如下代码让加入,并重命名为 再添加如

Limiiiing的博客 3876

EventLoop 事件循环机制

Event Loop 在JavaScript中,任务被分为两种,一种宏任务(MacroTask)也叫Task,一种叫微任务(MicroTask)。

Dark_programmer的博客 7488

从0到1打造一台机器人走起来

1)本体机械结构设计,依据人体生物学和生物力学知识,结合机器人运动时各关节扭矩需求,进行合理选用电机,比如胯部需要大扭矩,腿部惯量小等2)硬件拓扑上,分层架构的信号层和功率协同工作,高带宽,低延时,硬实时3)步态规划设计与验证环节实机回溯和部署过程:Real2Sim,Sim2Sim,Sim2Real。

weixin_43163941的博客 244

事件循环机制EventLoop

事件循环机制EventLoop Event Loop即事件循环,是解决javaScript单线程运行阻塞的一种机制。 一、EventLoop的相关概念 1、堆(Heap) 堆表示一大块非结构化的内存区域,对象,数据被存放在堆中 2、栈(Stack) 栈在javascript中又称执行栈,调用栈,是一种后进先出的数组结构, Javascript 有一个 主线程(main thread)和 调用栈(或执行栈call-stack),主线各所有的任务都会被放到调用栈等待主线程执行。 JS调用栈采用的是后进先出的规

一条单行线 8829

构建高效的LLM应用测试框架

《构建高效的LLM应用测试框架》 关键词:LLM,测试框架,应用测试,效率优化,测试原理 摘要:本文将深入探讨构建高效LLM应用测试框架的必要性、方法与步骤,旨在为开发者提供一套系统化、可操作的测试解决方案,从而提升LLM

AI天才研究院 1048

Data-Structures-and-Algorithm-Analysis-in-Java.pdf

作者: Weiss, Mark A. 出版社: Addison Wesley Data Structures and Algorithm Analysis in Java is an “advanced algorithms” book that fits between traditional CS2 and Algorithms Analysis courses. In the old ACM Curriculum Guidelines, this course was known as CS7. This text is for readers who want to learn good programming and algorithm analysis skills simultaneously so that they can develop such programs with the maximum amo...

JavaScript:事件循环机制(EventLoop)

当一个宏任务中产生了微任务,这些微任务会先被放到一个专门的队列中,等待当前宏任务执行完毕时再执行。而在执行这些微任务时,如果又产生了新的微任务,这些新的微任务会被放到队列的末尾,等待执行。当当前任务执行完成后,在下一个事件循环的开始,JavaScript会从任务队列中取出一个任务,执行该任务。然后再执行宏任务队列中的任务。总的来说,JavaScript通过事件循环机制来实现异步操作,将异步任务放到任务队列中,然后在任务队列中等待执行,直到JavaScript引擎空闲,再将任务队列中的任务拿出来执行。

snow的博客 1万+

VC中sqlite的使用

在VC中对sqlite的使用,实现数据库大批数据的快速插入,读取数据库中的数据在ListCtrl中显示

理解JS的事件循环机制(Event Loop)

JS是单线程语言,但是又可以做到异步处理高并发请求,这时就用到了JavaScript的事件循环机制。

铁锤妹妹的博客 7494

大中型超市收银系统(可直接运行)

光步前台收银系统系统功能:商品销售、商品退货、挂单、收银员权限、会员销售、单品取消、整单取消、商品查询、脱机销售、脱机数据上传,基本资料下载,开钱箱、小票打印、收款结算,支持多币种付款方式(现金、储值卡、礼券、微信等),支持多种促销。运行环境:.net 4.0登陆信息用户名:1001 密码:123456内置商品信息,商品编码可输入00001000 - 00010000,测试效果相关功能键F5 结算 F9挂单 F11商品查询 F8退货 Insert单品取消 Del整单取消 F12开钱箱F2 会员 Ctrl+Z退出系统 Home 锁屏 相关源码待公开

WINCC7.3破解文件

WINCC7.3硬件够破解文件,有需要的下载!WINCC7.3硬件够破解文件,有需要的下载!

Javascript中的事件循环机制详解

事件循环负责执行代码、收集和处理事件以及执行队列中的子任务。JavaScript中的事件循环是一种异步执行机制,作用是协调和管理各种异步任务的执行顺序,以确保JavaScript代码执行的顺序和预期一致。代码在执行时会先执行同步任务,而异步任务则被放入任务队列中等待执行。事件的循环机制会不断地检查任务队列中是否有任务需要执行,如果有,则将任务取出并执行。在执行异步任务时,引擎会挂起当前任务的执行,去执行异步任务,等到异步任务执行完成后,再回到之前的任务继续执行。

Dreamweaver_Bob的博客 5048

事件循环机制(Eventloop)

在JavaScript的执行环境中,事件循环(Event Loop)是实现非阻塞异步执行的关键机制。它由主线程(也称为调用栈)和任务队列(Event Queue)组成,这两个组件协同工作以确保同步和异步任务的有序执行。文章结尾附上真题解析主线程(Call Stack):这是JavaScript引擎执行同步代码的场所。当代码被执行时,同步任务会被压入调用栈中,按照后进先出(LIFO)的原则依次执行。任务队列(EventQueue):这是一个先进先出(FIFO)的数据结构,用于存储异步任务的回调函数。

weixin_44735965的博客 2790

EventLoop 事件循环机制详解

首先清楚javaScript这门语言是一门单线程非阻塞的脚本语言。 单线程是指在执行javascript代码的时候,只有一个主线程按照一定的顺序执行任务。 非阻塞是指当代码需要进行一项异步任务,的时候,主线程会挂起这个任务,然后在异步结果返回时根据一定规则执行相应的回调。 javascript使用单线程其实是有原因的,单线程的缺点也是很明显的, ...

weixin_45111619的博客 2668

JavaScript 事件循环机制(Event Loop)简述

JavaScript 是浏览器的脚本语言。其主要作用是与客户端进行交互。最开始设计之初它就是单线程。因为它主要操作 DOM。如果设计成多线程,假设一个线程在操作某个 DOM 节点,一个线程又在删除这个 DOM 节点。这时候浏览器就无法判断以哪个线程为主,这种复杂的场景大大增加了语言的难度。所以 JavaScript 从一诞生就是单线程。也是它最重要的特性之一。

杏子 1万+

什么是eventloop(事件循环)?

关于eventloop事件循环的理解,还有栈队列堆的理解,单线程eventloop和多线程模型的比较

qzwzsl的博客 2280

事件循环机制 => EventLoop详解

我们都知道 Js 是单线程都,但是一些高耗时操作就带来了进程阻塞问题。为了解决这个问题,Js 有两种任务的执行模式:同步模式(Synchronous)和异步模式(Asynchronous)。在异步模式下,创建异步任务主要分为宏任务与微任务两种。ES6 规范中,宏任务(Macrotask) 称为 Task, 微任务(Microtask) 称为 Jobs。宏任务是由宿主(浏览器、Node)发起的,而微任务由 JS 自身发起。宏任务与微任务的几种创建方式。

2401_84123265的博客 1265

事件循环机制 (EventLoop)

事件循环机制 (EventLoop):是js的一个底层运行原理,js是单线程的,但是也有一些耗时任务,会影响执行效率,代码都在主线程中执行,当遇见你像ajax请求.setTimeout 定时器时候,会 单独开启异步线程.异步线程耗时之后会推入异步队列中等待执行.然后当主线程执行完毕之后.会到异步队列中取出到主线程中执行.然后再去异步队列中取第二个.这个来回取的过 程就是您所说的事件循环(eventLoop) lE.

qq_48294048的博客 2167

JavaScript 事件循环(EventLoop) —— 浏览器 & Node

JavaScript 事件循环(EventLoop) —— 浏览器 & Node

weixin_43822185的博客 1018
上一篇: vue 进入到一个新路由页面后,路由组件页面缓存,如何实现路由组件刷新重载?
下一篇: 如何在H5移动端页面中调起手机拨打电话功能?
归来巨星
归来巨星 新星创作者: 前端开发技术领域 新星创作者: 前端开发技术领域
博客等级 码龄7年 5391粉丝 95原创
评论 13
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

归来巨星

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值