18 个重要视频彻底改变了我对 JavaScript 的理解

事件循环到底是什么？[Philip Roberts]

事件循环的进一步冒险 [Erin Zimmer]

《In The Loop》[杰克·阿奇博尔德]

关于 Node.js 事件循环你需要知道的一切 [Bert Belder]

Node.js 事件循环：并非单线程 [Bryan Hughes]

回忆：别忘了倒垃圾 [凯蒂·芬恩]

破碎的承诺[詹姆斯·斯内尔]

你不知道的 Node [Samer Buna]

使用 Quokka.js 的 JavaScript 迭代器 [Mattias Petter Johansson]

JavaScript 中的生成器 [Mattias Petter Johansson]

流向未来 [Matteo Collina]

学习使用 JavaScript 进行函数式编程 [Anjana Vakil]

javaScript 调用 apply 和 bind [techsith]

JavaScript 中的原型 [Mattias Petter Johansson]

JavaScript 事件捕获、传播和冒泡 [Wes Bos]

Fizz buzzkill - 回答棘手的 JS 面试问题 [Russell Anderson]

编写安全的 Node 代码：理解并避免最常见的 Node.js 安全错误 [Guy Podjarny]

JavaScript 元编程 - ES6 代理的使用和滥用 [Eirik Vullum]

学习 JavaScript 是一段狂野而充满风暴的旅程。四年前我第一次学习这门语言时，我并不知道这段旅程会如此漫长。我更没有想到，最初那几行不起眼的 JavaScript 代码，最终会成为我踏入 Web 开发世界的关键垫脚石。

我如今的知识，很大一部分都归功于那些在我之前走过这段旅程的先驱们。他们的理念和创新为我铺平了道路，让我能够站在巨人的肩膀上继续前行。

几周前，我写了一篇关于如何以“建设性愚蠢”的好奇心面对未知的文章，文中我主张承认并接受知识上的差距，以此作为有效学习的一种方式。JavaScript 以及 Web 开发领域有太多东西需要学习，我无法想象对于像我一样刚接触这门语言的人来说，未知会是多么令人畏惧，因此我写了这篇文章。

以下是我精心挑选的 18 个视频和会议演讲，它们从根本上改变了我对 JavaScript 的理解。如果没有这些才华横溢的人士将他们的知识免费分享给所有人，我的 JavaScript 之旅就不会走到今天。

每一个视频，我都会经历一个“顿悟时刻”，在第一次观看时，它帮助我拼凑出更完整的画面。我当然需要进一步研究，但从那一刻起，一切都开始“豁然开朗”。可以说，它就是拼图中缺失的那一块。

通过这份“必看视频”列表，我希望能够像先驱者对我所做的那样，推动 JavaScript 开发人员朝着正确的方向前进。

注意：以下视频并非全部面向初学者。本列表涵盖了 JavaScript 生态系统的多个方面：语言特性、Node.js、运行时内部机制（例如事件循环）、性能、优化、安全性以及一些 ES6 特性。

事件循环到底是什么？[Philip Roberts]

任何“JavaScript 必看视频”的清单，如果没有探索传奇的事件循环，就不算完整。在这个以平易近人著称的演讲中，Philip Roberts 为我们奠定了深入探索事件循环这一“兔子洞”所需的基础。

事件循环的进一步冒险 [Erin Zimmer]

现在我们已经具备了基本的直观理解，Erin Zimmer 的演讲将深入探讨事件循环的技术细节，同时又不失通俗易懂的叙述方式。Zimmer 通过她出色的可视化演示，解释了事件循环每次迭代过程中的底层中间步骤。

《In The Loop》[杰克·阿奇博尔德]

在本次演讲中，Jake Archibald 将“循环”的字面概念作为其事件循环可视化的核心。他着手解决浏览器中的 UI 卡顿问题，并揭开了渲染循环、globalThis.setInterval计时器和window.requestAnimationFrame钩子的神秘面纱。

关于 Node.js 事件循环你需要知道的一切 [Bert Belder]

由于人们对事件循环的真正本质存在诸多困惑，Bert Belder 揭穿了一些不幸的常见误解，这些误解源于不太准确的图表和可视化。

Node.js 事件循环：并非单线程 [Bryan Hughes]

在谈论 JavaScript 时，“单线程”这个词经常被随意提及。在本演讲中，Bryan Hughes 演示了 JavaScript 本身可能是单线程的，但尽管如此，其整体运行时显然并非如此。此外，他还从性能角度探讨了 Node.js 有限线程池的影响。

回忆：别忘了倒垃圾 [凯蒂·芬恩]

内存是一种有限的资源。我们无法在客户的机器中添加更多内存。我们只能用完它，丢弃它，然后再重新使用。我们必须妥善保管分配给我们的资源，因为我们无法获得更多的内存。

尽管 JavaScript 引擎的内部垃圾收集器让内存管理变得无关紧要，但 Katie Fenn 提醒我们，忽视内存使用会对应用程序性能和用户体验造成灾难性的后果。在演讲中，她通过各种示例说明了如何轻松追踪未使用的变量、滞留的事件监听器以及恶意计时器。

破碎的承诺[詹姆斯·斯内尔]

“在承诺链中，唯一应该拥有同步代码的地方是在最终Promise#then处理程序中。”

ES6 Promise的引入彻底改变了 JavaScript 中异步编程的语义。然而，其强大的功能也带​​来了更多的误用。在本演讲中，James Snell 将深入探讨 Promise 的各种可能、即将发生以及已经被滥用的情况。从混合回调到冗余包装器，这是一场关于如何掌握 Promise 的至关重要的演讲。

你不知道的 Node [Samer Buna]

大多数关于 Node 的教育内容都讲解 Node 包……但这些 Node 包实际上封装了 Node 运行时。当你遇到问题时，很可能是 Node 运行时本身的问题。所以，如果你不了解 Node 运行时，你就有麻烦了。

由于众多 NPM 软件包抽象出了 Node.js 的核心，Samer Buna 选择了退一步，让我们更仔细地思考一下我们对 Node 基础知识的熟悉程度。在这次问答式的演讲中，Buna 分享了一些关于 Node.js 内部运作的花絮和知识点。

使用 Quokka.js 的 JavaScript 迭代器 [Mattias Petter Johansson]

在此视频中，Mattias Petter Johansson（或简称为Fun Fun Function的“MPJ” ）解释了for...of循环的工作原理，它基本上只是迭代器设计模式的本机 JavaScript 实现。

JavaScript 中的生成器 [Mattias Petter Johansson]

MPJ 重构了他之前关于迭代器的视频中的代码示例，演示了ES6 生成器如何只是迭代器的“语法糖”。

流向未来 [Matteo Collina]

流构成了 Node.js 核心库的基础：文件系统交互、数据压缩和网络——所有这些都以某种方式使用流。在简短介绍流基础知识后，Matteo Collina 介绍了他们在 Node.js 中的最新成果：一种利用异步迭代器的流抽象。使用for await...of循环，人们可以与流交互，而无需担心 Collina 在演讲中提到的那些令人讨厌的内存泄漏和陷阱。

学习使用 JavaScript 进行函数式编程 [Anjana Vakil]

Anjana Vakil 使用明亮而巧妙的类比来描述术语和概念，对 JavaScript 中的函数式编程进行了平易近人的介绍，而没有使用与之相关的所有密集的数学术语。

javaScript 调用 apply 和 bind [techsith]

函数是 JavaScript 中“一等公民”的概念常常让很多初学者感到困惑，尤其是我自己。当它与this关键字的细微差别混杂在一起时，所有的this就变成了一团模糊不清的 JavaScript 术语。在这个视频中，“techsith”区分了Function#call、Function#apply和Function#bind方法。通过这种方式，他提供了关键的见解，帮助人们全面理解this。

JavaScript 中的原型 [Mattias Petter Johansson]

与许多传统的面向对象语言（例如 Java 和 C++）不同，JavaScript 并没有实现经典的继承模型（即类直接从其父类继承属性和方法）。相反，JavaScript 使用“原型继承”，即 JavaScript“类”的对象实例共享并保存对“原型”对象的引用。

这是一个相当棘手的概念。我花了很长时间才理解，但最终理解之后，很大程度上要归功于 MPJ 的一系列关于对象创建的视频。上面的视频作为补充，进一步巩固了原型继承的总体框架。

JavaScript 事件捕获、传播和冒泡 [Wes Bos]

事件分派和处理机制是 HTML DOM 不可或缺的功能。在本视频中，Wes Bos 解释了事件在“捕获阶段”和“冒泡阶段”的“传播”含义。了解何时利用每个阶段，可以实现更强大的事件处理技术，例如“事件委托”和默认行为取消。

Fizz buzzkill - 回答棘手的 JS 面试问题 [Russell Anderson]

与Samer Buna 关于 Node 基础知识的问答式演讲类似，Russell Anderson 测试了我们对 JavaScript 语言中一些基本概念、技术和惯用语的常识。他以一种初学者友好的方式，解答了 JavaScript 面试中不可避免会出现的问题。

编写安全的 Node 代码：理解并避免最常见的 Node.js 安全错误 [Guy Podjarny]

鉴于 JavaScript 生态系统高度依赖共享代码和深度嵌套的依赖关系，我们面临着一个令人担忧的现实：我们部署的绝大多数代码都来自第三方。虽然这无疑提高了生产力并加快了开发时间，但也带来了一个不幸的后果：我们的应用程序将面临更大的攻击面。在本次演讲中，Guy Podjarny 探讨了在处理外部代码时保持警惕和谨慎的重要性。

JavaScript 元编程 - ES6 代理的使用和滥用 [Eirik Vullum]

ES6 代理使我们能够拦截并钩住语言的各个方面。JavaScript 元编程的新时代为更强大的 polyfill、语言扩展和自定义行为打开了大门。

然而，鉴于代理对语言语义的巨大影响，Eirik Vullum 提醒我们要负责任地使用代理。他的演讲对比了代理的奇妙可能性以及同样奇妙的潜在滥用途径。

为了方便您查看，我将这些视频整理成了一个不公开的 YouTube 播放列表。虽然我不可能列出所有帮助我理解 JavaScript 的视频，但我希望您仍然能从我的视频列表中找到宝贵的经验。