为什么 JavaScript 正则表达式中的 alternation 操作符（|）不会返回两个匹配项？

在 JavaScript 正则表达式中，alternation 操作符（也称为“管道”操作符）用于指定两个或多个选择项之一。例如，正则表达式 /cat|dog/ 匹配字符串中的 “cat” 或 “dog”。

然而，当我们使用 g 全局标志来查找所有匹配项时，有些人可能会期望这样的表达式 /cat|dog/g 能够匹配字符串中的所有 “cat” 和 “dog”。但是实际上，它只匹配了第一个被发现的选择项。那么为什么会这样呢？

原因

JavaScript 正则表达式在匹配时是从左到右扫描字符串的，一旦某个模式匹配成功，它就会停止扫描并返回该匹配项。因此，对于 /cat|dog/g，如果字符串中先出现了 “cat”，那么它就会返回 “cat”，而不会继续查找 “dog”。

解决方案

要想匹配所有的选择项，可以使用括号来分组这些选择项，并将全局标志应用到整个组，而不是单个选择项。例如，表达式 /(cat|dog)/g 将匹配所有的 “cat” 和 “dog”。

下面是一个示例代码：

const str = "I have a cat and a dog.";
const regex1 = /cat|dog/g;
const regex2 = /(cat|dog)/g;

console.log(str.match(regex1)); // Output: ["cat"]
console.log(str.match(regex2)); // Output: ["cat", "dog"]

指导意义

理解 JavaScript 正则表达式中的 alternation 操作符的行为，可以帮助我们编写更准确、更有效的正则表达式。同时，还需注意全局标志 g 的使用方式，以便正确地匹配所有的模式。

在实际项目中，我们应该根据具体的业务需求，选择合适的正则表达式，并进行测试和优化，以确保其在各种情况下都能正确地工作。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/27759