ES2021 揭开神秘面纱：用一篇文章搞懂最新特性

ES2021，又称 ECMAScript 2021，是 JavaScript 语言的最新版本。它于 2021 年 6 月发布，带来了许多令人兴奋的新特性和改进，可以帮助开发者更轻松、更高效地构建应用程序。

在本文中，我们将重点介绍 ES2021 中最引人注目的几个新特性。这些特性包括：

• 字符串新能力：ES2021 为字符串添加了许多新方法，包括 String.prototype.replaceAll()、String.prototype.matchAll() 和 String.prototype.trimStart()。这些新方法使处理字符串变得更加容易。
• 数字和数组增强：ES2021 还对数字和数组进行了增强。例如，数字现在具有 Number.isInteger() 和 Number.isNaN() 等新方法，而数组具有 Array.prototype.flat() 和 Array.prototype.flatMap() 等新方法。这些新方法使处理数字和数组变得更加灵活。
• RegExp 的革新：ES2021 为 RegExp 引入了许多新特性，包括命名捕获组、反向引用和 unicode 属性。这些新特性使使用正则表达式变得更加强大和灵活。

除了这些主要的新特性外，ES2021 还包含了许多其他改进和新增功能。例如，它引入了全局变量 import.meta，该变量允许模块访问其自己的元数据。它还改进了 JavaScript 的错误处理机制，使开发人员能够更轻松地捕获和处理错误。

ES2021 是 JavaScript 语言发展史上的一次重大更新。它为开发者提供了许多新的工具和功能，可以帮助他们更轻松、更高效地构建应用程序。如果你正在寻找一种方法来提高你的 JavaScript 开发技能，那么学习 ES2021 是一个很好的起点。

现在，让我们仔细看看 ES2021 中的一些具体新特性。

字符串新能力

ES2021 为字符串添加了许多新方法，包括：

• String.prototype.replaceAll(): 该方法可以将字符串中的所有指定子字符串替换为另一个字符串。例如：

const str = "Hello, world!";
const newStr = str.replaceAll("!", "?");
console.log(newStr); // "Hello, world?"

• String.prototype.matchAll(): 该方法可以返回一个迭代器，该迭代器生成字符串中所有匹配指定正则表达式的子字符串。例如：

const str = "The quick brown fox jumps over the lazy dog.";
const matches = str.matchAll(/the/gi);
for (const match of matches) {
  console.log(match);
}

• String.prototype.trimStart(): 该方法可以从字符串的开头移除所有空白字符。例如：

const str = "   Hello, world!   ";
const newStr = str.trimStart();
console.log(newStr); // "Hello, world!   "

数字和数组增强

ES2021 还对数字和数组进行了增强。例如：

• 数字现在具有 Number.isInteger() 和 Number.isNaN() 等新方法。Number.isInteger() 方法可以检查一个数字是否为整数，而 Number.isNaN() 方法可以检查一个数字是否为 NaN。例如：

console.log(Number.isInteger(123)); // true
console.log(Number.isNaN(NaN)); // true

• 数组具有 Array.prototype.flat() 和 Array.prototype.flatMap() 等新方法。Array.prototype.flat() 方法可以将多维数组展平为一维数组，而 Array.prototype.flatMap() 方法可以将多维数组展平为一维数组，并对每个元素应用一个映射函数。例如：

const arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
const newArr = arr.flat();
console.log(newArr); // [1, 2, 3, 4, 5, 6, 7, 8, 9]

const newArr2 = arr.flatMap(x => x * 2);
console.log(newArr2); // [2, 4, 6, 8, 10, 12, 14, 16, 18]

RegExp 的革新

ES2021 为 RegExp 引入了许多新特性，包括：

• 命名捕获组：命名捕获组允许你为正则表达式中的子模式指定名称。这使得从正则表达式匹配中提取数据变得更加容易。例如：

const str = "The quick brown fox jumps over the lazy dog.";
const regex = /^(?<adjective>The) (?<color>quick) (?<animal>brown) (?<verb>jumps) over the (?<adjective2>lazy) (?<animal2>dog)\.$/;
const match = regex.exec(str);
console.log(match.groups); // { adjective: "The", color: "quick", animal: "brown", verb: "jumps", adjective2: "lazy", animal2: "dog" }

• 反向引用：反向引用允许你引用正则表达式中先前匹配的子模式。这使得创建更复杂的正则表达式变得更加容易。例如：

const str = "The quick brown fox jumps over the lazy dog.";
const regex = /^(?<word>The) (?<word>\w+) (?<word>\w+) (?<word>\w+) (?<word>\w+) over the (?<word>\w+) (?<word>\w+)\.$/;
const match = regex.exec(str);
console.log(match.groups); // { word: "The", word: "quick", word: "brown", word: "fox", word: "jumps", word: "over", word: "the", word: "lazy", word: "dog" }

• unicode 属性：unicode 属性允许你指定正则表达式应如何处理 unicode 字符。这使得创建能够匹配任何语言文本的正则表达式变得更加容易。例如：

const str = "Hello, world! こんにちは、世界！";
const regex = /[\p{Letter}\p{Mark}]+/gu;
const matches = str.matchAll(regex);
for (const match of matches) {
  console.log(match);
}