为什么全球旗（global flag）的 regexp 给出错误的结果？

正则表达式（RegExp）是前端开发中十分常用的工具之一。而其中一个重要的标志位就是全球旗（global flag）。然而，在某些情况下，使用全球旗的 RegExp 可能会给出错误的结果。本文将探讨这种现象的原因，并提供解决方案。

全球旗的作用

在 JavaScript 中，RegExp 对象有三个标志位：g、i 和 m。其中，g 表示全球旗，表示匹配所有符合条件的文本而非只匹配第一个。例如，以下代码：

const str = 'hello world';
const reg = /l/g;
const result = str.match(reg);
console.log(result); // ["l", "l"]

可以看到，使用了全球旗后，结果包含了字符串中所有符合条件的字母 l。

全球旗可能导致错误的情况

然而，在某些情况下，使用全球旗可能会导致错误的结果。具体来说，就是涉及到 lastIndex 属性的情况。

lastIndex 是 RegExp 对象的一个属性，表示从哪个索引开始搜索下一个匹配项。使用全球旗时，每次成功匹配后 lastIndex 的值都会被更新。例如：

const str = 'hello world';
const reg = /l/g;
console.log(reg.lastIndex); // 0
console.log(reg.test(str)); // true
console.log(reg.lastIndex); // 3
console.log(reg.test(str)); // true
console.log(reg.lastIndex); // 4

可以看到，每次匹配成功后，lastIndex 的值都会被更新。这是全球旗的正常工作方式。

然而，在某些情况下，这种行为可能会导致错误的结果。例如：

const str = 'hello world';
const reg = /l/g;
let result;
while (result = reg.exec(str)) {
    console.log(result);
}

执行上述代码，会输出以下内容：

["l", index: 2, input: "hello world"]
["l", index: 3, input: "hello world"]
null

可以看到，第二个匹配项并不是字母 l，而是字符 o。这是因为在 while 循环中，每次调用 exec 方法时，lastIndex 的值都会被更新，从而影响下一次匹配的结果。在本例中，由于字母 o 出现在字母 l 的后面，因此它被误认为是下一个匹配项。

解决方案

为了避免这种情况，我们可以在每次循环前手动将 lastIndex 重置为 0。例如：

const str = 'hello world';
const reg = /l/g;
let result;
while (result = reg.exec(str)) {
    console.log(result);
    reg.lastIndex = 0;
}

执行上述代码，会输出以下内容：

["l", index: 2, input: "hello world"]
["l", index: 3, input: "hello world"]
null

可以看到，结果与期望相符，没有出现错误的情况。

结论

全球旗是 RegExp 对象中的一个标志位，在某些情况下可能会导致错误的结果。这是因为它会影响 lastIndex 属性的值，从而影响下一次匹配的结果。为了避免这种情况，我们可以在每次循环前手动将 lastIndex 重置为 0，以确保每次匹配都从字符串的开头开始。

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