ECMAScript 生态系统

2025-05-27

ECMAScript 生态系统

JavaScript 是一门非常棒的语言。它不断发展,不断添加新的特性和功能。然而,确定某种语法是否适用可能并非易事。根据你的项目,需要考虑各种因素。所以,让我们来聊聊吧!

新语法

let thing = obj?.node?.thing ?? 2
Enter fullscreen mode Exit fullscreen mode

上面的示例使用了两种全新的 JavaScript 语法。可选链(记为 )?.空值合并(记为??。假设你想在项目中使用这行代码。你需要做什么?技术栈的哪个部分甚至决定了什么是有效的 JavaScript?

ECMAScript

要回答上述问题,我们必须从头说起。JavaScript 基于名为 ECMAScript 的脚本语言标准。该标准本身也在不断变化,并添加新功能。这个过程由一个名为TC39的委员会控制。

JavaScript 社区的任何成员都可以提出新增功能的提案。提案在评估是否被纳入的过程中,会经历多个阶段。这其中有一些复杂之处,但通常情况下,提案会经历第一阶段、第二阶段和第三阶段。第三阶段的提案必须在 Babel 中实现——我们稍后会讲到这一点。

最后一个阶段是第 4 阶段。可选链式调用和空值合并现在都处于这个阶段。此阶段的提案被视为已采纳!它们是动态 ECMAScript 版本(称为 ESNext)的一部分。ESNext 包含一些即将包含在下一个版本中的功能。ECMAScript 每年发布一次,并包含前一年所有第 4 阶段的提案。例如,ES2019 于 2018 年 6 月发布。

然而,达到 Stage 4 的功能并不一定意味着您现在可以使用它。如果您想包含最新的语法,您需要了解 ECMAScript 标准的采用和支持情况。

巴别塔

想要使用全新的第 4 阶段提案(或者,如果你想提供反馈,甚至可以使用更早的阶段提案),最好的办法就是在你的项目中包含Babel插件。为什么选择 Babel?

Babel 是一个 JavaScript 转译器。它允许你使用现代语法编写 JavaScript,然后将该代码编译为“旧版”JavaScript;因此它可以在尚不支持该现代语法的情况下运行。

Babel 可以独立运行,但通常与 webpack 等工具捆绑在一起。构建 JavaScript 项目时,输出仍然是 JavaScript。不过,它的可读性通常会比以前差很多,具体取决于构建过程的具体情况。为了方便理解,我们假设讨论的是生产环境的构建。

下一步是在某个地方运行构建好的 JavaScript。这个地方就是你的目标环境。

JavaScript 无处不在

我们经常开玩笑说 JavaScript 无处不在,但这确实有点道理。创建 JavaScript 项目时,你并不总是知道它会在哪里运行。相反,你关注的是要支持的目标环境的最低版本。那么,什么才算是目标环境呢?

JavaScript 在浏览器中运行。浏览器存在于桌面和移动设备上,因此所有这些都是潜在的目标环境。使用 Node 时,JavaScript 也可以在服务器端运行。了解服务器端目标环境比确信所有用户都会使用特定的浏览器版本更有可能。但是,无论是在服务器端还是客户端,目标环境都会影响您可以使用的 ECMAScript 功能。

JavaScript 引擎

JavaScript 使用即时编译器 (JIT) 运行。它是一个编译并解释代码的引擎。事实上,所有 JavaScript 引擎都是按照 ECMAScript 标准创建的。引擎将有效的 JavaScript(由标准定义)转换为有效的机器码。

由于每个引擎都是按照 ECMAScript 标准编写的,因此引擎本身决定了您可以在项目中使用哪些语法。每个目标环境都有其自己的引擎!您的用户使用什么浏览器访问您的网站?该浏览器中使用什么引擎?该引擎是否支持您尝试在代码中使用的语法?

兼容性

我们知道 JavaScript 引擎是为了支持 ECMAScript 标准而编写的。因此,这些引擎是决定特定语法是否有效的最终仲裁者。但我们也知道该标准在不断发展。那么,如何知道目标引擎是否包含您想要使用的功能呢?

网络上有多个项目致力于维护更新的兼容性表。这些表跟踪可用的编译器/polyfill、浏览器和 Node 版本,并匹配 ECMAScript 特性以了解它们是否受支持。

还有一些很棒的网站,例如https://caniuse.com/

“版本”

兼容性表的各列将各种类型的技术归为一类。浏览器(我们将移动端和桌面端归为一类)、编译器/polyfill 以及服务器/运行时 JavaScript。

浏览器会定期发布更新并附加版本号。兼容性表涵盖了最新和最流行的稳定版本,并注明了内部 JavaScript 引擎是否支持特定的 ECMAScript 标准(及其相关语法)。移动设备浏览器也包含在内。

编译器/polyfills 部分包含多种不同的技术。请注意,Babel 和 Typescript 列包含core-js版本号。这指的是提供 JavaScript polyfills 的库。虽然 Babel 正在转译大部分现有语法,但仍缺少一些功能,例如新的关键字或粗箭头符号。因此core-js需要注明版本号。

请注意,在底层@babel/polyfill存在并使用。但是,它已被弃用,取而代之的是直接使用。core-jscore-js

表中的最后一组列与服务器/运行时 JavaScript 相关。我将重点介绍node这一点。Node 包含许多允许 JavaScript 在服务器端运行的功能,其中之一就是 JavaScript 引擎。在本例中,它使用 V8 引擎。这实际上与 Chrome 浏览器运行的引擎相同。Node 本身也有不同的版本。每个版本都与 V8 引擎捆绑在一起,并且根据 V8 版本所支持的 ECMAScript 标准,确定哪种语法是有效的 JavaScript。

支持 JavaScript 应用程序

JavaScript 的魅力之一在于,它有多种编写方式,并且能够立即看到其实际运行效果。但事实证明,生产级 JavaScript 的底层实现远不止这些。

使用与最低公分母目标环境兼容的语法编写代码将极具挑战性。如果这就是门槛,那么在所有浏览器都支持可选链式调用之前,我们将在未来很多年内都无法使用它。或者,我们会将用户限制在最新的手机和/或浏览器更新上。正如你可能猜到的,开发者并不想这样做。

生产应用程序会询问构建的 JavaScript 的兼容性问题。包含的语法是否与我们最小目标环境中的引擎兼容?这就是项目使用 Babel 等转译器的原因。为了创建与旧版浏览器兼容的 JavaScript。这样,即使 Internet Explorer 尚未支持(或永远不会支持),你也可以使用可选链。

即使不了解这些信息,你也可以开发出令人惊叹的 JavaScript 项目。但是,如果你对新功能的诞生感到好奇,或者想在项目中支持一些前沿技术,那么了解这些细节会很有帮助。

文章来源:https://dev.to/laurieontech/the-ecmascript-ecosystem-2e13
PREV
JavaScript 的层次
NEXT
package.json 的剖析