【JS Web 前端知识库】24.说一说事件循环Event loop，宏任务与微任务？

最新推荐文章于 2024-11-08 22:13:17 发布
最新推荐文章于 2024-11-08 22:13:17 发布
阅读量167 收藏
点赞数 1
分类专栏： 宏任务 微任务 Event loop 文章标签： 前端 javascript 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/liu_can/article/details/128856561
版权
本文详细阐述了JavaScript的事件循环机制，包括同步任务和异步任务的处理方式。在事件循环中，同步任务直接执行，异步任务在完成后放入任务队列。宏任务和微任务是异步任务的两个类型，宏任务如定时器、I/O、UI渲染，而微任务如Promise回调、MutationObserver。每个宏任务执行完毕后，会先执行当前宏任务内的所有微任务。在Node.js环境中，微任务在下一个宏任务开始前执行；而在浏览器中，微任务则在当前宏任务的末尾执行。
摘要由CSDN通过智能技术生成

24.说一说事件循环Event loop，宏任务与微任务？

得分点:

任务挂起、同步任务执行结束执行队列中的异步任务、执行script标签内部代码、setTimeout/setInterval、ajax请求、 postMessageMessageChannel、setImmediate、I/O（Node.js）Promise、MutonObserver、Object.observe、process.nextTick（Node.js）每个宏任务中都包含了一个微任务队列

标准回答

  1. 浏览器的事件循环：执行js代码的时候，遇见同步任务，直接推入调用栈中执行，遇到异步任务，将该任务挂起，等到异步任务有返回之后推入到任务队列中，当调用栈中的所有同步任务全部执行完成，将任务队列中的任务按顺序一个一个的推入并执行，重复执行这一系列的行为。
  2. 异步任务又分为
最低0.47元/天 解锁文章
浏览器事件循环、Node.js 事件循环（任务队列 异步 非阻塞、宏任务与微任务）
HZFEStudio的博客
10-30 319
完整高频题库仓库地址：https://github.com/hzfe/awesome-interview 完整高频题库阅读地址：https://febook.hzfe.org/ 相关问题 什么是浏览器事件循环 浏览器为什么需要事件循环 Node.js 中的事件循环 回答关键点 任务队列 异步 非阻塞 浏览器需要事件循环来协调事件、用户操作、脚本执行、渲染、网络请求等。通过事件循环，浏览器可以利用任务队列来管理任务，让异步事件非阻塞地执行。每个客户端对应的事件循环是相对独立的。 知识点深入 1. 什么是浏
深入理解JavaScript的事件循环（Event Loop） 一、什么是事件循环
tzllxya的博客
06-17 2万+
深入理解JavaScript的事件循环（Event Loop） 一、什么是事件循环 JS的代码执行是基于一种事件循环的机制，之所以称作事件循环，MDN给出的解释为因为它经常被用于类似如下的方式来实现 while (queue.waitForMessage()) { queue.processNextMessage(); } 如果当前没有任何消息queue.waitForMes...
浏览器视角看 —— 消息队列和事件循环、宏任务和微任务
一个做过前端开发的产品经理，经历过睿智产品的折磨导致脱发之后，励志要翻身"农奴"把歌唱，一边打入敌人内部一边持续提升自己，为我们广大开发同胞谋福祉，坚决抵制睿智产品折磨我们码农兄弟！
08-08 596
JavaScript 是一门单线程的语言，这意味着它在同一时间只能做一件事。为了管理异步行为，JavaScript 引入了事件循环(Event Loop)的概念。事件循环是JavaScript引擎的核心组件之一，它负责管理JavaScript的执行流程，包括同步代码的执行和异步回调的调度。通过本文的讲解，我们深入了解了JavaScript的消息队列和事件循环机制，以及宏任务和微任务的区别和执行顺序。理解这些核心概念有助于我们写出更高效、更可靠的代码，并且能够在实际开发中有效地处理各种异步问题。
JS的执行原理，一文了解Event Loop事件循环、微任务、宏任务
前端开发博客
02-05 124
大家好，我是宝哥本文将带你深入探讨JavaScript这门语言的运行原理,揭开事件循环、微任务和宏任务隐藏在幕后的奥秘。面试官：你了解JavaScript事件循环吗，掌握多少，把你知道的都说一下。今天我们就来说一下，JavaScript作为一门单线程语言，如何通过事件循环（Event Loop）和任务队列（Task Queue）的机制，高效地处理异步任务，保证用户体验的流畅性。在本文中，我们将详细...
2024前端面试题！（附答案及解析）（2024.11月最新版）
热门推荐
这世上从不缺让人上头的新鲜感，能顾及你情绪的人实属难得。
03-27 18万+
2024前端面试题！面试宝典！总结心得！（附答案及解析）会持续更新哦！（2024.11月最新版）感谢支持，你们的鼓励是我的动力！
前端知识库
hulovelove的博客
09-04 621
预解析：JS引擎会把js里面所有的变量和函数声明语句提升到当前作用域的最前面预解析分为：变量预解析（变量提升）和函数预解析（函数提升）变量提升：把所有变量声明var提升到当前作用域最前面 不提升赋值操作函数提升：把所有函数声明function提升到当前作用域最前面 不调用函数一个函数有权访问另外一个函数作用域中的变量 叫闭包。在一个函数外部访问在这个函数内部定义的局部变量，就需要在一个函数内部再定义一个函数，通过return返回到函数外部，从而满足需求，这个过程形成闭包。
谈谈 Event Loop（事件循环）机制
qq_45670012的博客
09-28 388
在讲 Event Loop （事件循环）之前，我们来了解点 node 的东西，来帮助我们更加明白事件循环是干什么的 Node 是什么 Node.js 是一个基于 Chrome V8 引擎的 JavaS...
前端Node.js面试题
CRMEB小程序商城的博客
11-12 1222
一、Node基础概念 1.1 Node是什么 Node.js 是一个开源与跨平台的 JavaScript 运行时环境。在浏览器外运行 V8 JavaScript 引擎（Google Chrome 的内核），利用事件驱动、非阻塞和异步输入输出模型等技术提高性能。我们可以理解为：Node.js 就是一个服务器端的、非阻塞式I/O的、事件驱动的JavaScript运行环境。 理解Node，有几个基础的概念：非阻塞异步和事件驱动。 非阻塞异步： Nodejs采用了非阻塞型I/O机制，在做I/O操作的时候不会造成任何
js事件循环
yy869949908的博客
09-20 665
javascript 是单线程脚本语言，那么为什么不像 java 一样变成多线程，它不香吗？让我们来看一个问题，如果 js 是多线程，那么来看看执行下面这段代码-- 浏览器解析 h1标签的时候，渲染为红色 --> < script > document . querySelector("h1") . style . css . color = "green";// 上面这条js代码也找到h1标签，渲染为绿色 stylecolorred;
前端学习笔记-Node.js
05-26
1. **Event Loop事件循环**：理解事件驱动编程的核心，包括事件、事件Emitter、事件处理函数等概念。 2. **非阻塞I/O**：探讨Node.js如何实现非阻塞I/O，以及异步编程在Node.js中的重要性。 3. **流(Stream)**：学习...
一些前端面试题.pdf
06-20
微前端架构是一种将大型前端应用分解成多个小型独立部署的前端服务的方法。每个服务可以独立开发、部署和扩展，提高了开发效率和可维护性。 ### 前端测试策略 前端测试通常包括三种类型：单元测试、集成测试和...
Web 前端基础知识面试大全
m0_56349322的博客
04-01 1万+
一、HTML 1.对 HTML 语义化的理解 见标签知其意思 header main nav aside footer h1-h6 ul li 优点：结构清晰、方便搜索引擎搜素（seo）、方便理解维护 2.区别：src 和 href src 比如常见的 <img src=""> 这里的 src 所指的是这个图片的所在的位置路径，script 和 iframe 也是，src 被解析的时候，会进行下载并编译，同时会暂停该文档其他资源的下载和处理，所以 js 文件的载入最好在 bod...
前端基础知识点-每天一个基本知识点（100+个前端小知识，你是否都知道？）
m0_67394006的博客
03-02 9231
文章目录 前言 第一回合 一、知识点：cookie（21/09/06） 二、知识点：节流和防抖（21/09/07） 三、知识点：var和let以及const（21/09/08） 四：知识点：深拷贝和浅拷贝（21/09/09） 五、知识点：作用域和作用域链（21/09/10） 六、知识点：从输入URL到页面展示这中间发生了什么（21/09/11） 七、知识点：重排和重绘（21/09/12） 八、知识点：TCP和UDP（21/09/13） 九、知识点：三次握手（21/09/15） 十、知识点：绝对定位和相对定
Webserver(3.3)生产者消费者模型
学习历程记录和分享
11-05 348
解决该问题需要用互斥量确保线程同步，用条件变量或者信号量去解决生产者和消费者之间同步的问题，生产者把数据生产满了要通知消费者去消费。会产生数据安全问题，比如生产者还未生产出来，就去消费。
vxe-grid ，增加新行，并且定位到新增的行
花花鱼的专栏
11-05 203
vxe-grid新增空行，并且定位到空行位置。
JavaScript 实现文本转语音功能
最新发布
bjjgff的博客
11-08 255
通过这篇教程，我们使用 HTML、CSS 和 JavaScript 构建了一个简单的文本转语音应用。该项目不仅展示了 Web Speech API 的强大功能，同时也展示了如何将前端技术结合起来实现有趣的功能。希望这篇文章对你有所帮助，如果有任何问题或改进建议，欢迎在评论区留言！相关文章你从未见过的 10 个令人惊叹的 JavaScript 技巧HTML+CSS+JS 实现动态模态超级英雄卡片效果使用 HTML 和 CSS 创建 3D 菜单效果。
vue前端进行AES加密，JAVA对其进行AES解密
Ls66666Ls的博客
11-04 255
【代码】vue前端进行AES加密，JAVA对其进行AES解密。
vue种ref跟reactive的区别?
renqq001的博客
11-07 483
vue种ref跟reactive的区别?
【JavaEE进阶】导读
2401_83227065的博客
11-08 669
随着技术的发展, ⽆论是后端开发还是前端开发, 开发的时候都很少使⽤原⽣的代码，⽐如：JDBC、JS 等. 取⽽代之的是各种开发框架. 如：后端框架：Spring, SpringBoot, Mybatis等，前端常⽤的框架： Vue、Node等. 这些框架都有⼀个共同的特点, 就是简单, ⾼效. 这极⼤的提⾼了我们的开发效率. 那什么是框架呢?通俗的来讲: 框架是实现某种功能的半成品, 他提供了⼀些常⽤的⼯具类, 我们在框架的基础上, 可以更加⾼效的进⾏开发.
探索Node.js特性及其在高性能Web服务器中的应用
非阻塞I/O让Node.js在处理大量并发请求时不需要为每个请求分配一个线程，而是使用事件循环（event loop）来处理回调函数，这样就可以在单个线程上同时处理成千上万的并发连接。这样的架构使得Node.js非常适合于构建I...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

打赏作者

随风一样自由

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

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

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

打赏作者

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

抵扣说明：

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

余额充值