JS中正则表达式捕获组与反向引用详解

正则表达式（Regular Expression，简称 Regex）是一种强大的字符串匹配工具，它能够让我们通过模式来查找、匹配、替换字符串中的内容。而在正则表达式中，捕获组是一个非常重要的概念，常常用于将匹配到的内容保存下来供后续操作。今天我们就来详细讲解 JavaScript 中的捕获组、反向引用、以及替换操作中的 $1、$2 等符号。

1. 什么是捕获组（Capture Group）

捕获组的定义

捕获组 是指通过用小括号 () 将正则表达式中的一部分包裹起来，从而将这部分内容单独保存下来。捕获组不仅可以用来对模式进行分组，还可以将匹配到的内容保存，方便后续的引用和替换。

捕获组的作用：

• 分组：用括号将模式的一部分分组，使其在逻辑上能够被看作一个整体。
• 捕获匹配的内容：括号中的内容匹配成功后会被捕获，并可以通过编号（从 1 开始）来引用。
• 后续引用：捕获的内容可以在正则表达式或替换操作中重新使用。

2. 如何创建捕获组

在 JavaScript 中，创建捕获组非常简单，只需要将正则表达式的一部分用括号 () 包裹起来即可。

示例 1：简单的捕获组

const regex = /(hello) (world)/;
const str = "hello world";
const result = regex.exec(str);
console.log(result);
// 输出: ["hello world", "hello", "world"]

• "(hello)" 是第一个捕获组，匹配到的是 "hello"。
• "(world)" 是第二个捕获组，匹配到的是 "world"。
• result[0] 保存的是整个匹配的字符串 "hello world"，而 result[1] 和 result[2] 分别保存的是第一个和第二个捕获组的匹配结果。

3. 反向引用（Backreference）

反向引用的概念

反向引用是指在同一个正则表达式中，引用之前定义的捕获组匹配的内容。通过 \1、\2 等符号可以引用之前捕获组中的内容。

• \1 代表第一个捕获组的内容。
• \2 代表第二个捕获组的内容，以此类推。

示例 2：反向引用

const regex = /(\d{3})-(\d{3})-\1/;
const str1 = "123-456-123";
const str2 = "123-456-789";

console.log(regex.test(str1)); // 输出 true
console.log(regex.test(str2)); // 输出 false

在这个例子中：

• (\d{3}) 是一个捕获组，它匹配三个连续的数字。
• \1 引用第一个捕获组，也就是说，第三组数字必须和第一个组匹配的内容相同。
• str1 中第三组数字是 "123"，与第一个组匹配的 "123" 相同，因此返回 true。
• 而在 str2 中，第三组是 "789"，与第一个组不相同，因此返回 false。

4. 替换操作中的 $1、$2

在正则表达式的替换操作中，捕获组同样起到了非常重要的作用。JavaScript 提供了 replace() 方法来进行字符串替换，并允许我们使用 $1、$2 等符号来引用捕获组的内容。

• $1 引用第一个捕获组匹配到的内容。
• $2 引用第二个捕获组匹配到的内容，以此类推。

示例 3：使用捕获组进行替换

const str = "John Smith";
const regex = /(\w+)\s(\w+)/;
const newStr = str.replace(regex, "$2, $1");

console.log(newStr); 
// 输出: "Smith, John"

在这个例子中：

• (\w+) 是第一个捕获组，匹配名字 "John"。
• (\w+) 是第二个捕获组，匹配姓氏 "Smith"。
• "$2, $1" 在 replace() 中表示将第二个捕获组的内容放在前面，第一个捕获组的内容放在后面。因此，名字和姓氏的顺序被互换，输出结果为 "Smith, John"。

5. $ 符号的其他用法

除了在替换操作中用作捕获组的引用，$ 在正则表达式中还有其他特殊用途。最常见的是用于匹配字符串的结尾。

示例 4：匹配字符串结尾

const regex = /world$/;
const str1 = "hello world";
const str2 = "hello worlds";

console.log(regex.test(str1)); // 输出 true
console.log(regex.test(str2)); // 输出 false

• world$ 表示匹配以 "world" 结尾的字符串。
• 字符串 "hello world" 以 "world" 结尾，因此匹配成功，返回 true。
• 字符串 "hello worlds" 以 "worlds" 结尾，不符合模式，返回 false。

6. 进阶：非捕获组（Non-Capturing Group）

在有些情况下，我们可能只想对某些部分进行分组，而不希望捕获这些内容。为了实现这一点，JavaScript 支持非捕获组。非捕获组的语法是 (?:...)。

示例 5：非捕获组

const regex = /(?:hello) world/;
const str = "hello world";
const result = regex.exec(str);
console.log(result);
// 输出: ["hello world"]

• (?:hello) 是一个非捕获组，虽然它会匹配 "hello"，但不会保存这个匹配结果。
• 这样做的好处是，当我们不需要反向引用时，可以减少不必要的捕获组，从而优化正则表达式的性能。

总结

捕获组、反向引用、以及替换操作中的 $1、$2 是正则表达式中的重要工具，它们极大地提高了我们处理字符串的灵活性和效率。掌握这些知识后，我们可以：

• 创建捕获组：使用 () 将正则表达式中的部分分组并捕获内容。
• 使用反向引用：通过 \1、\2 等符号引用之前捕获的内容。
• 替换操作：使用 $1、$2 在 replace() 中引用捕获组进行复杂的字符串替换。
• 灵活应用：学会在适当场合使用非捕获组来优化性能。