”工欲善其事,必先利其器。“—孔子《论语.录灵公》
首页 > 编程 > 事件循环

事件循环

发布于2024-08-23
浏览:754

Event Loop

介绍
JavaScript 主要在 Node.js 和浏览器中的单个线程上执行(有一些例外,例如工作线程,这超出了当前文章的范围)。在这篇文章中,我将尝试解释 Node.js 的并发机制,即事件循环。

在开始阅读本文之前,您应该熟悉堆栈及其工作原理,我过去写过这个想法,所以请查看堆栈和堆 — 不要在不了解它们的情况下开始编码 — Moshe Binieli |中等的

介绍图片
示例
我相信通过示例学习是最好的,因此我将从 4 个简单的代码示例开始。我将分析示例,然后深入探讨 Node.js 的架构。

示例1:
控制台.log(1);
控制台.log(2);
控制台.log(3);
// 输出:
// 1
// 2
// 3
这个例子很简单,第一步console.log(1)进入调用堆栈,被执行然后删除,第二步console.log(2)进入调用堆栈,被执行然后删除,以此类推 console.log(3).

示例 1 的调用堆栈可视化
示例2:
控制台.log(1);
setTimeout(函数 foo(){
控制台.log(2);
}, 0);
控制台.log(3);
// 输出:
// 1
// 3
// 2
在这个例子中我们可以看到我们立即运行setTimeout,所以我们期望console.log(2)在console.log(3)之前,但事实并非如此,让我们了解其背后的机制。

基本事件循环架构(稍后我们将深入探讨)

Stack & Heap:查看我关于此的文章(我在本文开头添加了链接)
Web API:它们内置于您的 Web 浏览器中,能够公开来自浏览器和周围计算机环境的数据,并用它执行有用的复杂操作。它们不是 JavaScript 语言本身的一部分,而是构建在核心 JavaScript 语言之上,为您提供在 JavaScript 代码中使用的额外超能力。例如,Geolocation API 提供了一些简单的 JavaScript 构造来检索位置数据,因此您可以说,在 Google 地图上绘制您的位置。在后台,浏览器实际上使用一些复杂的低级代码(例如 C )与设备的 GPS 硬件(或任何可用于确定位置数据的硬件)进行通信,检索位置数据,并将其返回到浏览器环境以使用在你的代码中。但同样,这种复杂性已被 API 抽象化。
事件循环和回调队列:完成Web API执行的函数将被移动到回调队列,这是一个常规队列数据结构,事件循环负责将下一个函数从回调队列中出队并将该函数发送到执行函数的调用堆栈。
执行顺序

当前位于调用堆栈中的所有函数都会被执行,然后它们会从调用堆栈中弹出。
当调用堆栈为空时,所有排队的任务都会一一弹出到调用堆栈中并执行,然后从调用堆栈中弹出。
让我们来理解示例 2

console.log(1)方法被调用并放置在调用堆栈上并被执行。

  1. setTimeout 方法被调用并放置在调用堆栈上并被执行,此执行创建一个对 setTimeout Web Api 的新调用,持续 0 毫秒,当它完成时(立即,或者更准确地说,那么它会最好说“尽快”)Web Api 将调用移至回调队列。

  2. console.log(3)方法被调用并放置在调用堆栈上并被执行。

  3. Event Loop发现Call Stack为空,从Callback Queue中取出“foo”方法放入Call Stack,然后执行console.log(2)。

示例 2 的过程可视化
所以setTimeout(function,delay)中的delay参数并不代表函数执行后的精确时间延迟。它代表等待的最短时间,之后在某个时间点将执行该函数。

示例3:
控制台.log(1);
setTimeout(函数 foo() {
console.log('foo');
}, 3500);
setTimeout(函数 boo() {
console.log(‘嘘’);
}, 1000);
控制台.log(2);
// 输出:
// 1
// 2
// '嘘'
// 'foo'

示例 3 的过程可视化
例4:
控制台.log(1);
setTimeout(函数 foo() {
console.log('foo');
}, 6500);
setTimeout(函数 boo() {
console.log(‘嘘’);
}, 2500);
setTimeout(函数 baz() {
console.log(‘baz’);
}, 0);
for ([‘A’, ‘B’] 的 const 值) {
console.log(值);
}
函数二() {
控制台.log(2);
}
二();
// 输出:
// 1
// 'A'
// 'B'
// 2
// '巴兹'
// '嘘'
// 'foo'

示例 4 的过程可视化
事件循环继续执行任务队列中等待的所有回调。任务队列内部,任务大致分为两类,即微任务和宏任务。

宏任务(任务队列)和微任务
更准确地说,实际上有两种类型的队列。

  1. 宏任务队列(或简称任务队列)。
  2. 微任务队列。

还有一些任务进入宏任务队列和微任务队列,但我将介绍常见的任务。

常见的宏任务有 setTimeout、setInterval 和 setImmediate。
常见的微任务有 process.nextTick 和 Promise 回调。
执行顺序
当前位于调用堆栈中的所有函数都会被执行,然后它们会从调用堆栈中弹出。
当调用堆栈为空时,所有排队的微任务都会一一弹出到调用堆栈中并执行,然后从调用堆栈中弹出。
当调用栈和微任务队列都为空时,所有排队的宏任务都会一一弹出到调用栈中并执行,然后从调用栈中弹出。
例5:
控制台.log(1);
setTimeout(函数 foo() {
console.log('foo');
}, 0);
Promise.resolve()
.then(函数 boo() {
console.log(‘嘘’);
});
控制台.log(2);
// 输出:
// 1
// 2
// '嘘'
// 'foo'
console.log(1) 方法被调用并放置在调用堆栈上并被执行。
SetTimeout 正在执行,console.log(‘foo’) 被移至 SetTimeout Web Api,0 毫秒后移至宏任务队列。
Promise.resolve() 正在被调用,正在被解析,然后 .then() 方法被移动到微任务队列。
console.log(2) 方法被调用并放置在调用堆栈上并被执行。
Event Loop 发现调用堆栈为空,它首先从 Micro-Task 队列中取出任务,即 Promise 任务,将 console.log('boo') 放在调用堆栈上并执行它。
事件循环看到调用堆栈为空,然后看到微任务为空,然后从宏任务队列中取出下一个任务,即 SetTimeout 任务,放入 console.log('foo')在调用堆栈上并执行它。

示例 5 的过程可视化
对事件循环的高级理解
我正在考虑写一篇关于事件循环机制如何工作的底层文章,它本身可以是一篇文章,所以我决定介绍该主题并附上深入解释该主题的良好链接。

事件循环底层解释
当 Node.js 启动时,它会初始化事件循环,处理提供的输入脚本(或放入 REPL),这可能会进行异步 API 调用、调度计时器或调用 process.nextTick(),然后开始处理事件循环。

下图显示了事件循环操作顺序的简化概述。 (每个框将被称为事件循环的一个“阶段”,请查看介绍图片以更好地理解循环。)

事件循环操作顺序的简化概述
每个阶段都有一个要执行的回调的 FIFO 队列(我在这里小心地说,因为根据实现的不同,可能会有其他数据结构)。虽然每个阶段都有其特殊之处,但通常,当事件循环进入给定阶段时,它将执行特定于该阶段的任何操作,然后执行该阶段队列中的回调,直到队列耗尽或达到最大回调数已执行。当队列耗尽或达到回调限制时,事件循环将进入下一阶段,依此类推。

阶段概述
计时器:此阶段执行由 setTimeout() 和 setInterval() 安排的回调。
挂起的回调:执行延迟到下一个循环迭代的 I/O 回调。
空闲,准备:仅内部使用。
Poll:检索新的I/O事件;执行 I/O 相关回调(几乎所有回调,关闭回调、计时器调度的回调和 setImmediate() 除外);节点会在适当的时候阻塞在这里。
检查:此处调用了 setImmediate() 回调。
关闭回调:一些关闭回调,例如socket.on('关闭', ...).
前面的步骤如何适合这里?
因此,前面仅使用“回调队列”,然后使用“宏和微队列”的步骤是关于事件循环如何工作的抽象解释。

还有一件重要的事情要提,事件循环应该在处理宏任务队列中的一个宏任务之后完全处理微任务队列。

第1步:事件循环将循环时间更新为当前执行的当前时间。
第2步:执行微队列。
步骤 3:执行计时器阶段的任务。
第四步:检查微队列中是否有东西,如果有则执行整个微队列。
步骤5:返回步骤3,直到Timers阶段为空。
步骤 6:执行 Pending Callbacks 阶段的任务。
步骤7:检查微队列中是否有东西,如果有则执行整个微队列。
步骤8:返回步骤6,直到Pending Callbacks阶段为空。
然后空闲…微队列…轮询…微队列…检查…微队列…关闭回调然后重新开始。
因此,我很好地概述了事件循环在幕后如何实际工作,有很多遗漏的部分我在这里没有提到,因为实际文档在解释它方面做得很好,我将提供很好的链接文档,我鼓励您花 10-20 分钟来理解它们。

版本声明 本文转载于:https://dev.to/atulnagose1499/event-loop-4fck?1如有侵犯,请联系[email protected]删除
最新教程 更多>
  • MySQL 中的数据库分片:综合指南
    MySQL 中的数据库分片:综合指南
    随着数据库变得越来越大、越来越复杂,有效地控制性能和扩展就出现了。数据库分片是用于克服这些障碍的一种方法。称为“分片”的数据库分区将大型数据库划分为更小、更易于管理的段(称为“分片”)。通过将每个分片分布在多个服务器上(每个服务器保存总数据的一小部分),可以提高可扩展性和吞吐量。 在本文中,我们将探...
    编程 发布于2024-11-06
  • 如何将 Python 日期时间对象转换为秒?
    如何将 Python 日期时间对象转换为秒?
    在 Python 中将日期时间对象转换为秒在 Python 中使用日期时间对象时,通常需要将它们转换为秒以适应各种情况分析目的。但是,toordinal() 方法可能无法提供所需的输出,因为它仅区分具有不同日期的日期。要准确地将日期时间对象转换为秒,特别是对于 1970 年 1 月 1 日的特定日期...
    编程 发布于2024-11-06
  • 如何使用 Laravel Eloquent 的 firstOrNew() 方法有效优化 CRUD 操作?
    如何使用 Laravel Eloquent 的 firstOrNew() 方法有效优化 CRUD 操作?
    使用 Laravel Eloquent 优化 CRUD 操作在 Laravel 中使用数据库时,插入或更新记录是很常见的。为了实现这一点,开发人员经常求助于条件语句,在决定执行插入或更新之前检查记录是否存在。firstOrNew() 方法幸运的是, Eloquent 通过firstOrNew() 方...
    编程 发布于2024-11-06
  • 为什么在 PHP 中重写方法参数违反了严格的标准?
    为什么在 PHP 中重写方法参数违反了严格的标准?
    在 PHP 中重写方法参数:违反严格标准在面向对象编程中,里氏替换原则 (LSP) 规定:子类型的对象可以替换其父对象,而不改变程序的行为。然而,在 PHP 中,用不同的参数签名覆盖方法被认为是违反严格标准的。为什么这是违规?PHP 是弱类型语言,这意味着编译器无法在编译时确定变量的确切类型。这意味...
    编程 发布于2024-11-06
  • 哪个 PHP 库提供卓越的 SQL 注入防护:PDO 还是 mysql_real_escape_string?
    哪个 PHP 库提供卓越的 SQL 注入防护:PDO 还是 mysql_real_escape_string?
    PDO vs. mysql_real_escape_string:综合指南查询转义对于防止 SQL 注入至关重要。虽然 mysql_real_escape_string 提供了转义查询的基本方法,但 PDO 成为了一种具有众多优点的卓越解决方案。什么是 PDO?PHP 数据对象 (PDO) 是一个数...
    编程 发布于2024-11-06
  • React 入门:初学者的路线图
    React 入门:初学者的路线图
    大家好! ? 我刚刚开始学习 React.js 的旅程。这是一次令人兴奋(有时甚至具有挑战性!)的冒险,我想分享一下帮助我开始的步骤,以防您也开始研究 React。这是我的处理方法: 1.掌握 JavaScript 基础知识 在开始使用 React 之前,我确保温习一下我的 JavaScript 技...
    编程 发布于2024-11-06
  • 如何引用 JavaScript 对象中的内部值?
    如何引用 JavaScript 对象中的内部值?
    如何在 JavaScript 对象中引用内部值在 JavaScript 中,访问引用同一对象中其他值的对象中的值有时可能具有挑战性。考虑以下代码片段:var obj = { key1: "it ", key2: key1 " works!" }; ...
    编程 发布于2024-11-06
  • Python 列表方法快速指南及示例
    Python 列表方法快速指南及示例
    介绍 Python 列表用途广泛,并附带各种内置方法,有助于有效地操作和处理数据。下面是所有主要列表方法的快速参考以及简短的示例。 1. 追加(项目) 将项目添加到列表末尾。 lst = [1, 2, 3] lst.append(4) # [1, 2, 3, 4]...
    编程 发布于2024-11-06
  • C++ 中何时需要用户定义的复制构造函数?
    C++ 中何时需要用户定义的复制构造函数?
    何时需要用户定义的复制构造函数?复制构造函数是 C 面向对象编程的组成部分,提供了一种基于现有实例初始化对象的方法。虽然编译器通常会为类生成默认的复制构造函数,但在某些情况下需要进行自定义。需要用户定义复制构造函数的情况当默认复制构造函数不够时,程序员会选择用户定义的复制构造函数来实现自定义复制行为...
    编程 发布于2024-11-06
  • 尝试...捕获 V/s 安全分配 (?=):现代发展的福音还是诅咒?
    尝试...捕获 V/s 安全分配 (?=):现代发展的福音还是诅咒?
    最近,我发现了 JavaScript 中引入的新安全赋值运算符 (?.=),我对它的简单性着迷。 ? 安全赋值运算符 (SAO) 是传统 try...catch 块的简写替代方案。它允许您内联捕获错误,而无需为每个操作编写显式的错误处理代码。这是一个例子: const [error, respons...
    编程 发布于2024-11-06
  • 如何在Python中优化固定宽度文件解析?
    如何在Python中优化固定宽度文件解析?
    优化固定宽度文件解析为了有效地解析固定宽度文件,可以考虑利用Python的struct模块。此方法利用 C 来提高速度,如以下示例所示:import struct fieldwidths = (2, -10, 24) fmtstring = ' '.join('{}{}'.format(abs(fw...
    编程 发布于2024-11-06
  • 蝇量级
    蝇量级
    结构模式之一旨在通过与相似对象共享尽可能多的数据来减少内存使用。 在处理大量相似对象时特别有用,为每个对象创建一个新实例在内存消耗方面会非常昂贵。 关键概念: 内在状态:多个对象之间共享的状态独立于上下文,并且在不同对象之间保持相同。 外部状态:每个对象唯一的、从客户端传递的状态。此状态可能会有所不...
    编程 发布于2024-11-06
  • 解锁您的 MySQL 掌握:MySQL 实践实验室课程
    解锁您的 MySQL 掌握:MySQL 实践实验室课程
    通过全面的 MySQL 实践实验室课程提高您的 MySQL 技能并成为数据库专家。这种实践学习体验旨在指导您完成一系列实践练习,使您能够克服复杂的 SQL 挑战并优化数据库性能。 深入了解 MySQL 无论您是想要建立强大 MySQL 基础的初学者,还是想要提升专业知识的经验丰富的开...
    编程 发布于2024-11-06
  • 文件夹
    文件夹
    ? ?大家好,我是尼克?? 利用专家工程解决方案提升您的项目 探索我的产品组合,了解我如何将尖端技术、强大的问题解决能力和创新热情结合起来,构建可扩展的高性能应用程序。无论您是寻求增强开发流程还是解决复杂的技术挑战,我都可以帮助您实现愿景。看看我的工作,让我们合作做一些非凡的事情! 在这里联系我:作...
    编程 发布于2024-11-06

免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。

Copyright© 2022 湘ICP备2022001581号-3