在 ECMAScript 2020 中，我们迎来了许多新的语言特性，其中一个值得特别注意的是 String.prototype.matchAll() 方法。这个新特性可以大大方便前端开发者在字符串匹配时的操作，下面我们来详细介绍它的使用方法和指导意义。
String.prototype.matchAll() 是什么？
String.prototype.matchAll() 方法用于查找字符串中匹配给定正则表达式的所有子字符串并返回一个迭代器。它可以极大地简化字符串的匹配操作，这一点在前端开发中应用颇广。
使用方法
String.prototype.matchAll() 方法的使用方法很简单。首先我们需要定义一个正则表达式，例如：
const re = /(\w+)@(\w+)\.com/g;
然后用这个正则表达式去匹配一个字符串，例如：
const str = 'john@example.com, bob@example.com'; const emails = str.matchAll(re);
这里我们用一个简单的字符串作为例子。使用 matchAll() 方法返回的是一个迭代器，我们可以通过迭代器的 next() 方法来遍历所有匹配结果，例如：
for (const email of emails) {
console.log(email[0]); // 匹配到的整个字符串
console.log(email[1]); // 第一个捕获组
console.log(email[2]); // 第二个捕获组
}在上面的例子中，我们使用了迭代器的 for...of 循环语句，不断调用 next() 方法来返回匹配到的每个子字符串及其捕获组，直到迭代器的 done 属性为 true。
正则表达式变量名捕获
String.prototype.matchAll() 方法不仅仅可以返回匹配到的字符串，还可以返回正则表达式的变量名捕获。例如：
const re = /(?<name>\w+)\s(?<age>\d+)/g;
const str = 'Bob 25, Tom 30';
const matches = str.matchAll(re);
for (const match of matches) {
console.log(match.groups.name); // 匹配到的名字
console.log(match.groups.age); // 匹配到的年龄
}上面的例子中，我们定义了一个正则表达式，它有两个变量名捕获，表示名字和年龄。使用 matchAll() 方法返回的迭代器不仅包含了匹配到的字符串，还包含了每个捕获组的变量名，我们可以直接访问它们。
指导意义
String.prototype.matchAll() 方法可以让前端开发人员更加便捷地进行字符串匹配操作，并且提供了新的特性，如变量名匹配捕获，方便开发人员对匹配到的字符串进行更进一步的操作，例如数据提取等等。
当然，使用 String.prototype.matchAll() 方法时，我们需要注意一些细节问题。例如，如果我们没有使用 g 全局标记，matchAll() 方法只会匹配第一个子字符串并返回。因此，在日常开发中，需要注意这种特性，以免引起错误。
结论
综上所述，String.prototype.matchAll() 方法是 ECMAScript 2020 中一个重要的新特性，它为前端开发人员提供了方便的字符串匹配操作，并具有很高的学习和指导意义。我们在日常开发中，可以尝试将它应用到我们的项目中，以便更好地完成字符串匹配任务。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6706f2abd91dce0dc863965a