ECMAScript 2020 新增了 String.prototype.matchAll 方法：正则匹配字符串更高效-JavaScript中文网-JavaScript教程资源分享门户

在 ECMAScript 2020 版本中，新增了 String.prototype.matchAll 方法，该方法可以让正则表达式匹配字符串更高效，同时在处理字符串时也更加方便。本文将详细介绍该方法的用法与实现原理，并提供示例代码来进行实践学习。

什么是 String.prototype.matchAll 方法？

String.prototype.matchAll 方法是 ECMAScript 2020 新增的原型方法之一，其作用是在字符串中进行正则表达式的全局匹配。matchAll 方法返回一个迭代器对象，可以使用该迭代器对象对匹配到的所有结果进行遍历。

String.prototype.matchAll 方法的语法

                str.matchAll(regexp)

其中，str 为要匹配的目标字符串，regexp 为正则表达式。

String.prototype.matchAll 方法的用法

在正常使用正则表达式进行匹配字符串时，我们通常使用 RegExp 对象的 exec 方法来进行匹配，但该方法只能匹配一个结果，需要对多个结果进行匹配时，需要使用循环语句来进行遍历。而使用 String.prototype.matchAll 方法则可以遍历匹配到的所有结果，十分方便。

const str = 'aaabbbccc';

// 使用 exec()
const regexp = /a/g;
let match = regexp.exec(str);
while (match !== null) {
  console.log(match[0]);
  match = regexp.exec(str);
}

// 使用 matchAll()
const regexp = /a/g;
const matches = str.matchAll(regexp);
for (const match of matches) {
  console.log(match[0]);
}

String.prototype.matchAll 方法的返回值

String.prototype.matchAll 方法返回一个迭代器对象，可以使用 for...of 循环或者 Array.from 方法将其转换成数组。

迭代器对象中的每个元素都是一个数组，数组的第一项为匹配到的完整字符串，其余项为正则表达式中的捕获组。

const str = 'aaabbbccc';
const regexp = /(a)(b*)(c*)/g;
const matches = str.matchAll(regexp);

for (const match of matches) {
  console.log(match);
}

输出结果为：

Array ["aaabbbccc", "a", "", ""]
Array ["aaabbbccc", "a", "", ""]
Array ["aaabbbccc", "a", "", ""]

String.prototype.matchAll 方法的实现原理

正则表达式对象具有状态，如匹配位置等信息。在 JavaScript 引擎内部，当使用 exec 方法匹配字符串时，RegExp 对象的状态会被更新，以便下一次匹配从当前位置开始。因此，正则表达式的全局匹配是需要循环遍历的。

可以使用 while 循环来实现全局匹配，但 matchAll 方法更简洁，使用迭代器对象实现全局匹配。

String.prototype.matchAll 方法的浏览器兼容性

Chrome：80+
Firefox：77+
Edge：80+
Safari：13.1+
Opera：67+

总结

本文详细介绍了 ECMAScript 2020 新增的 String.prototype.matchAll 方法，其可以让正则表达式匹配字符串更高效，同时在处理字符串时也更加方便。我们在实践中可以更好的理解该方法的使用和实现原理，提高代码质量和日期效率。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/65a7706fadd4f0e0ff0868aa

ECMAScript 2020 新增了 String.prototype.matchAll 方法：正则匹配字符串更高效