前端 JavaScript 正则表达式 exec 如何实现多次循环

前端JavaScript中的正则表达式exec方法可以通过多次调用实现循环搜索匹配项、在全局搜索模式下使用g标志进行重复匹配、保留上次搜索的位置、直至在目标字符串中再无法找到新的匹配项为止。主要的步骤包括创建正则表达式实例，使用g标志设置全局匹配模式，然后在一个循环中多次调用exec方法对字符串进行匹配。在这个过程中，每次调用exec都会从上次匹配结束的地方开始新的搜索，直到返回null为止，表明没有更多的匹配项可以被找到。

一、创建并设置正则表达式

在JavaScript中，你可以使用两种方式创建正则表达式：字面量方式和构造函数方式。这里，我们重点关注如何利用构造函数方式创建包含g标志的正则表达式。这是因为g（全局搜索）标志是利用exec进行循环匹配的关键。

let regex = new RegExp(pattern, 'g');

在这里，pattern是你想要匹配的字符串或者正则表达式的模式。

二、`exec`方法概述

exec方法是正则表达式对象的一个方法，它对字符串执行搜索匹配，并返回一个数组，其中包含了匹配的信息。如果正则表达式中包含括号，则返回的数组还会包含捕获组。

let result = regex.exec(string);

三、实现`exec`的多次循环

对于带有全局标志g的正则表达式，每次调用exec之后，正则表达式对象的lastIndex属性会更新为上次匹配文本之后的位置。因此，在一个循环中连续调用exec会遍历所有的匹配项。

while ((result = regex.exec(string)) !== null) {
    // 处理匹配项 result
}

四、`lastIndex`属性

lastIndex是正则表达式对象的一个属性，它记录了下一次匹配开始的位置。在不设置g标志时，lastIndex总是为0，因为它不会去寻找下一个匹配项。而在设置了g标志时，lastIndex将在每次匹配后更新。

五、匹配结果与捕获组

exec方法返回的数组不仅包含匹配的文本，还可能包含捕获组。例如，正则表达式/(\w+)\s(\w+)/g对字符串"Hello World"的匹配结果可能是：

["Hello World", "Hello", "World"]

六、循环中断

在某些情况下，你可能需要在满足特定条件时终止循环。你可以在循环内部使用break语句来实现这一点。

七、实际例子

让我们以搜索字符串中所有的单词为例，展示如何使用exec方法进行多次循环。

const string = "Learning JavaScript regex with exec method.";
const regex = /\b(\w+)\b/g;
let result;
while ((result = regex.exec(string)) !== null) {
    console.log(`Found: ${result[0]}, Next match starts at: ${regex.lastIndex}`);
}

以上代码演示了如何连续查找字符串中的所有单词，并且在控制台输出每个匹配项及下一次匹配开始的位置。

通过以上步骤，你可以有效地使用exec方法在JavaScript中实现正则表达式的多次循环，不断匹配字符串中的模式直至最后。这种方法特别适用于解析、提取信息等场景，能够帮助开发者写出高效而且易于维护的代码。