JavaScript新的令人兴奋的特性即将到来！即使新的ECMAScript 2020（ES2020）语言规范的最终批准将在6月份，您现在就可以开始查看并尝试它们！在这篇文章中跟我来探讨一下新特性。处理模块一些重要的创新与模块有关。其中，开发人员长期以来一直要求的一个特性是动态导入。不过，让我们按顺序去详细看看。动态进口当前导入模块的机制基于如下静态声明：从"./my"导入*作为MyModule-模块.js";此语句有两个约束条件：导入模块的所有代码在当前模块加载时进行计算模块的说明符（"./my-模块.js"在上面的示例中）是一个字符串常量，您不能在运行时更改它这些约束阻止有条件地或按需加载模块。此外，在加载时评估每个依赖模块会影响应用程序的性能。新的import（）语句通过允许动态导入模块来解决这些问题。语句接受模块说明符作为参数并返回一个promise。另外，模块说明符可以是任何返回字符串的表达式。这是个好消息，因为我们现在可以在运行时加载JavaScript模块，如下例所示：const baseModulePath="./modules"；常量Btnbook=文档.getElementById（"btnBooks"）；让书单=[]；btnBooks.addEventListener（"单击"，异步e=>{const bookModule=等待导入（`${baseModulePath}/图书.js`);书单=bookModule.loadList();});此代码显示如何加载图书.js当用户点击btnBooks按钮的时候。加载模块后，click事件处理程序将使用模块导出的loadList（）函数。注意如何通过字符串插值指定要导入的模块。"期待已久的动态导入现在可以在JavaScript ES2020中使用。"在推特上留言导入元数据这个导入.meta对象为当前模块提供元数据。JavaScript引擎创建它，它当前可用的属性是url。此属性的值是从中加载模块的URL，包括任何查询参数或哈希。例如，可以使用导入.meta.url属性来生成数据.json文件存储在当前模块的同一文件夹中。下面的代码得到这个结果：const dataUrl=新URL（"数据.json", 导入.meta.url);在这种情况下导入.meta.url为的URL类提供基URL数据.json文件。新导出语法ECMAScript 2015规范引入的import语句为您提供了多种形式的模块导入。以下是几个例子：从"./my"导入{value}-模块.js";从"./my"导入*-模块.js";在某些情况下，您可能需要导出从另一个模块导入的对象。方便的导出语法可能会对您有所帮助，如下所示：从"./my"导出{value}-模块.js";从"./my"导出*-模块.js";从开发人员体验的角度来看，import和export语句之间的这种对称性非常方便。但是，在这些新规范之前，特定案例不受支持：从"./my"导入*作为MyModule-模块.js";要导出MyModule命名空间，应使用两个语句：从"./my"导入*作为MyModule-模块.js";导出{MyModule}；现在，您可以用一个语句得到相同的结果，如下所示：从"./my"导出*为MyModule-模块.js";这个添加简化了代码，并保持了import和export语句之间的对称性。对象和数据类型新的ES2020规范引入了新的数据类型、标准化的全局对象和一些简化开发人员生活的方法。让我们看看。BigInt与任意精度整数如您所知，JavaScript对于数字只有一种数据类型：Number类型。此基元类型允许您表示64位浮点数字。当然，它也表示整数，但最大可表示值是253，对应于Number.MAX_SAFE_整数不变的。如果不深入研究整数表示的内部细节，那么在某些情况下，您可能需要更高的精度。考虑以下情况：与其他以64位整数形式提供数据的系统进行交互，例如guid、帐号或对象id需要64位以上的复杂数学计算的结果第一种情况的解决方法是将数据表示为字符串。当然，这种变通方法对第二种情况不起作用。新的BigInt数据类型旨在解决这些问题。只需将字母n附加到一个数字后，就可以表示文字BigInt，如下例所示：常数aBigInteger=98765432123456789n；也可以使用BigInt（）构造函数，方法与使用Number（）构造函数的方式相同：const aBigInteger=BigInt（"98765432123456789"）；当应用于bigint值时，typeof运算符现在返回"bigint"字符串：typeof aBigInteger//输出："bigint"别忘了，别忘了把它们混在一起。例如，尝试将数字值添加到BigInt值时会引发TypeError异常，如下图所示：必须使用BigInt（）构造函数将数值显式转换为BigInt值。"BigInt数据类型是JavaScript的新‘big’添加。"在推特上留言正则表达式的matchAll（）方法有几种方法可以获取给定正则表达式的所有匹配项。以下是其中一种方法，但您可以使用其他方法：const regExp=/page（\d+）/g；const text='文本页面1文本文本页面2'；让火柴；while（（匹配=正则表达式.exec（文本））！==空）{控制台.log（火柴）；}此代码通过迭代匹配文本变量中的所有pagex实例。每次迭代时，exec（）方法在输入字符串上运行，您将获得如下结果：第1页，"1"，索引：5，输入："文本页1文本文本页2"，组：未定义]第2页，"2"，索引：22，输入："文本页1文本文本页2"，组：未定义]使用一个compact（）方法可以获得更好的结果。下面的示例使用此新方法重写前面的代码：const regExp=/page（\d+）/g；const text='文本页面1文本文本页面2'；让匹配=[。。。文本.matchAll（regExp）]；for（匹配的常量匹配）{控制台.log（匹配）；}方法的作用是：返回迭代器。上一个示例使用spread运算符收集数组中迭代器的结果。地球这个物体访问全局对象需要不同的语法，具体取决于JavaScript环境。例如，在浏览器中，全局对象是window，但不能在webworker中使用它。在这种情况下，你需要使用self。还有，在节点.js全局对象是全局的。这会导致编写要在不同环境中运行的代码时出现问题。您可以使用this关键字，但它在模块和以严格模式运行的函数中未定义。global该对象提供了一种跨不同JavaScript环境访问全局对象的标准方法。因此，现在您可以以一致的方式编写代码，而不必检查当前运行的环境。但是，请记住，要尽量减少全局项的使用，因为这被认为是一种糟糕的编程实践。这个承诺。一切都解决了（）方法目前，JavaScript有两种组合承诺的方式：答应。全部（）和承诺。比赛().两种方法都以一系列承诺作为参数。下面是使用答应。全部():const promises=[fetch（/users"），fetch（"/roles"）]；const allResults=等待答应。全部（承诺）；答应。全部（）返回一个当所有承诺都实现时实现的承诺。如果至少有一个承诺被拒绝，则返回的承诺将被拒绝。结果承诺的拒绝原因与第一个被拒绝的承诺相同。当至少有一个承诺被拒绝时，这种行为并没有为您提供一个直接的方法来获得所有承诺的结果。例如，在上面的代码中，如果fetch（"/users"）失败，并且相应的promise被拒绝，那么您不容易知道fetch（"/roles"）的承诺是实现了还是被拒绝了。要获得这些信息，您必须编写一些附加代码。新的承诺。一切都解决了（）combinator等待所有的承诺得到解决，而不管结果如何。因此，下面的代码可以让您知道每个承诺的结果：const promises=[fetch（/users"），fetch（"/roles"）]；const allResults=等待承诺。一切都解决了（承诺）；const errors=结果.filter（p=>p.status=='拒绝'）.map（p=>p.reason）；特别是，这段代码让您知道每个被拒绝的承诺失败的原因。新操作员两个新运算符将使您在非常常见的操作中更容易编写和读取代码。猜猜是哪个？零凝聚算子你见过多少次并用过下面这样的表达方式？常量大小=设置.大小||42个；当您试图分配的值为null或未定义时，使用| |运算符来分配默认值非常常见。然而，这种方法可能会导致一些潜在的意外结果。例如，当设置.大小是0。但是当设置.大小是""或false。为了克服这些潜在的问题，现在可以使用null凝聚运算符（？？）。先前的代码如下：常量大小=设置.大小?? 42个；这允许只有当设置.大小为null或未定义