JavaScript 字符串 matchAll 迭代器用法

matchAll 方法返回的是一个迭代器对象，而非数组。因此，不能直接使用 map、forEach 等数组方法，必须通过 for...of 循环或展开运算符（...）将其转换为数组后处理。与 match() 方法相比，matchAll 能够保留捕获组、匹配位置（index）和原始字符串（input）等完整信息，特别适合需要结构化提取数据的场景。需要注意的是，正则表达式必须带有 g 标志，且该迭代器只能遍历一次，遍历后即失效。

如前所述，matchAll 返回的是迭代器而非数组，因此像 map、forEach 这类数组方法无法直接使用，需要先转换为数组（例如 [...str.matchAll(regex)]）或直接使用 for...of 遍历。这一特性在实际开发中非常实用，尤其是在处理大量匹配时，迭代器的惰性求值特性可以有效节省内存资源。

为什么要用 matchAll 而不是 match？

与 match() 相比，matchAll 能提供更完整的匹配信息。当正则表达式使用全局标志（g）时，match() 仅返回匹配内容的数组，丢失了捕获组和索引信息；而 matchAll() 每次匹配都会返回一个完整的 RegExpExecArray 对象，包含捕获组、匹配位置（index）和原始字符串（input）等全部信息。以下场景最能体现其优势：

• 当正则包含捕获组时，match() 无法区分各组内容，而 matchAll() 允许通过 result[1]、result[2] 等方式清晰访问每个捕获组
• 若需获取每个匹配在原字符串中的起始位置，直接使用 result.index 即可，无需手动计算
• 如果希望同时获取匹配文本、分组内容、位置和原始字符串，matchAll 几乎是唯一的选择

如何正确遍历 matchAll 的迭代器？

遍历 matchAll 返回的迭代器有两种常见方式：for...of 循环和展开运算符（[...str.matchAll(regex)]）转换为数组。两者各有适用场景：

• for...of 循环更节省内存，适合处理大文本或大量匹配，避免一次性构造整个数组带来的性能开销
• 展开操作 [...iter] 写法简洁，适合后续需要多次使用或链式调用的场景（如继续使用 .map()、.filter() 等方法）
• 虽然可以通过手动调用 .next() 来控制迭代器，但在日常开发中较少使用，直接使用 for...of 或展开操作即可满足需求

常见误用与避坑点

迭代器只能被遍历一次，遍历后即耗尽，再次获取结果将返回空数组。以下是一些常见错误和注意事项：

• 错误写法：先使用 Array.from(iter) 再使用 [...iter] 会导致第二个操作得到空数组，因为迭代器已被消费
• 正则表达式必须带有 g 标志，否则 matchAll 会抛出 TypeError: String.prototype.matchAll called with a non-global RegExp 错误
• 如果使用 flags: 'gi'，确保 g 存在；仅使用 i 或 u 等标志而不包含 g 时无法正常工作

实用小例子：提取标签和内容

以下是一个真实场景示例：从 HTML 片段中提取所有

...

内的内容，同时获取匹配文本、分组和位置信息。使用 matchAll 可以轻松实现：

const html = '
Hello
World
';
const regex = /
(.*)
/g;
const matches = [...html.matchAll(regex)];
matches.forEach(match => {
  console.log('全文:', match[0]);     // "
Hello
"
  console.log('内容:', match[1]);     // "Hello"
  console.log('起始位置:', match.index); // 0 或 13
});