在 ECMAScript 2021 中，新增了 RegExp.prototype.matchAll() 方法，该方法可以返回一个迭代器对象，用于遍历字符串中所有匹配某个正则表达式的子串。但是，这个方法返回的迭代器对象无法像其他迭代器一样使用 for...of 循环遍历，这给前端开发带来了很大的不便。本文将介绍如何解决这个问题，并提供示例代码。
问题分析
首先，我们来看一下 RegExp.prototype.matchAll() 返回的迭代器对象的结构：
{
[Symbol(Symbol.iterator)]() { /*...*/ },
next() { /*...*/ }
}其中，[Symbol.iterator] 方法返回迭代器对象自身，next 方法返回一个对象，该对象有两个属性：value 和 done。value 属性是一个数组，包含了当前匹配的所有子串的详细信息；done 属性是一个布尔值，表示迭代器是否已经遍历完了所有的子串。
由于 RegExp.prototype.matchAll() 返回的迭代器对象不是一个数组或类数组对象，因此无法使用 for...of 循环遍历。但是，我们可以通过将迭代器对象转换为数组或类数组对象，然后再使用 for...of 循环遍历，从而解决这个问题。
解决方案
下面是将迭代器对象转换为数组或类数组对象的示例代码：
// 将迭代器对象转换为数组对象 const matches = [...str.matchAll(regexp)]; // 将迭代器对象转换为类数组对象 const matches = Array.from(str.matchAll(regexp));
其中，str 是要匹配的字符串，regexp 是正则表达式。
如果要使用 for...of 循环遍历，只需要在上述代码的基础上添加一个 for...of 循环即可：
for (const match of matches) {
console.log(match);
}示例代码
下面是一个完整的示例代码，该代码演示了如何使用 RegExp.prototype.matchAll() 方法并解决无法循环的问题：
-- -------------------- ---- ------- ----- --- - ------- -------- ----- ------ - ------- -- ------------- ----- ------- - -------------------------- -- -- -------- ---- --- ------ ----- -- -------- - ------------------- -
输出结果如下：
["Hello"] ["world"]
总结
本文介绍了如何解决 ECMAScript 2021 中的 RegExp.prototype.matchAll() 方法无法循环的问题，并提供了示例代码。通过将迭代器对象转换为数组或类数组对象，然后再使用 for...of 循环遍历，可以轻松地遍历字符串中所有匹配某个正则表达式的子串。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65da9cca1886fbafa47d326b