在 JavaScript 的正则表达式中，捕获组是一个重要的概念，它能够使我们从匹配的字符串中提取出需要的信息。在 ES11 中，正则表达式引入了一种新的特性，就是重复捕获组。本文将对重复捕获组进行详细介绍，包括它的使用方法、应用场景以及示例代码。
什么是重复捕获组
重复捕获组是指在正则表达式中通过重复一个捕获组来捕获多个匹配项的值。在之前的 JavaScript 版本中，我们只能捕获最后一个匹配项的值，而现在我们可以使用重复捕获组来捕获全部匹配项的值。
下面是一个例子，假设我们有一个字符串 a1b2c3d4，我们想要从中提取出所有数字，可以使用如下的正则表达式：
const str = "a1b2c3d4"; const regExp = /\d/g; // 匹配所有数字 const result = str.match(regExp); console.log(result); // 输出 ["1", "2", "3", "4"]
在 ES11 中，我们可以使用重复捕获组来实现同样的功能：
const str = "a1b2c3d4"; const regExp = /(\d)+/g; // 匹配所有数字 const result = str.match(regExp); console.log(result); // 输出 ["1", "2", "3", "4"]
可以看到，在正则表达式中加上了括号，将 \d 匹配项包裹起来，形成了一个捕获组。然后在捕获组后面添加 + 符号，表示匹配一个或多个重复的捕获组。最后在正则表达式末尾加上 g 标志，表示全局匹配。这样就可以捕获所有的数字了。
重复捕获组的应用场景
重复捕获组的应用场景很多，下面列举几个常见的例子。
匹配多个 IP 地址
假设我们有一个字符串，包含了多个 IP 地址，我们想要从中提取出所有 IP 地址。可以使用如下的正则表达式：
const str = "192.168.1.2 10.0.0.1 127.0.0.1";
const regExp = /\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}/g;
const result = str.match(regExp);
console.log(result); // 输出 ["192.168.1.2", "10.0.0.1", "127.0.0.1"]这种方法虽然可行，但是比较繁琐。而使用重复捕获组，可以将正则表达式简化：
const str = "192.168.1.2 10.0.0.1 127.0.0.1";
const regExp = /(\d{1,3}\.){3}\d{1,3}/g;
const result = str.match(regExp);
console.log(result); // 输出 ["192.168.1.2", "10.0.0.1", "127.0.0.1"]可以看到，重复捕获组可以帮助我们更轻松地匹配多个 IP 地址。
替换多个匹配项
在 JavaScript 中，我们可以使用 replace 方法将字符串中的某个匹配项替换为另一个字符串。如果要替换多个匹配项，可以使用回调函数来实现。使用重复捕获组可以让回调函数更加简洁：
const str = "a1b2c3d4"; const regExp = /(\d)/g; const result = str.replace(regExp, "$1$1"); console.log(result); // 输出 "a11b22c33d44"
可以看到，回调函数中的参数 $1 表示捕获组中第一个匹配的值，使用重复捕获组可以将其简化为 $1$1。
注意事项
使用重复捕获组需要注意一些问题。首先，重复捕获组会在内存中记录每个匹配项的值，如果匹配项数量很大，可能会占用较多的内存。其次，重复捕获组的捕获顺序是从左往右的，而不是从右往左的。例如，对于字符串 a1b2c3d4，正则表达式 /(\w)(\d)+/g 可以匹配到 a1、b2 和 c3，而正则表达式 /(\d)+(\w)/g 则只能匹配到 1b 和 3d。
结论
重复捕获组是一种非常实用的正则表达式特性，在匹配多个值时可以帮助我们更加方便地提取需要的信息。在实际编程中，我们应该根据需求合理地使用重复捕获组，避免出现内存占用过大等问题。
参考资料
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6714b48ead1e889fe21535ac