JavaScript使用正则表达式

注：纯手打，如有错误欢迎评论区交流！
转载请注明出处：https://blog.csdn.net/testleaf/article/details/144537779
编写此文是为了更好地学习前端知识，如果损害了有关人的利益，请联系删除！
本文章将不定时更新，敬请期待！！！
欢迎点赞、收藏、转发、关注，多谢！！！

一、正则表达式的定义

正则表达式（Regular Expression，在代码中常简写为regex、regexp或RE）使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。搜索模式可用于文本搜索和文本替换。

二、正则表达式的创建

在JavaScript中，可以通过两种方式创建正则表达式：

1、字面量创建

使用斜杠/之间的模式，例如：

const re = /ab+c/;

这种方式在脚本加载时提供正则表达式的编译，如果正则表达式保持不变，使用这种方式可以提高性能。

2、构造函数创建

RegExp构造函数可以接受不同形式的参数来创建正则表达式对象：
2.1、接受一个字符串参数（表示正则表达式模式）

const re1 = new RegExp("abc");
// 等同于直接使用字面量形式 /abc/

这里创建的re1正则表达式对象用于匹配字符串中连续出现的"abc"字符序列。
2.2、接受两个参数，第一个是字符串形式的正则表达式模式，第二个是字符串形式的标志（flags）
常见的标志有：
g（global）：全局匹配，即匹配所有出现的符合模式的子串，而不只是第一个。
i（ignoreCase）：忽略大小写进行匹配。
m（multiline）：多行匹配，会改变^和$的行为，使其能匹配每行的开头和结尾（在多行文本中）。
示例：

const re2 = new RegExp("abc", "gi");
// 等同于 /abc/gi ，会忽略大小写地全局匹配"abc"

此re2正则表达式对象在匹配时，无论字符串中的"abc"是大写还是小写形式，都会进行匹配，并且会匹配所有出现的情况。
2.3、根据变量动态创建正则表达式
正如前面提到的，构造函数的优势在于可以基于动态的内容来创建正则表达式，比如根据用户输入：

const userInput = "hello";
const re3 = new RegExp(userInput + ".*");
// 假设从用户那里获取到"hello"，创建一个匹配以"hello"开头的任意字符序列的正则表达式
const str = "hello world, hello JavaScript";
const result = str.match(re3);
console.log(result);

在上述代码中：
首先获取了用户输入的字符串userInput（这里假设为"hello"）。
然后使用RegExp构造函数创建了一个正则表达式re3，它的模式是userInput + ".*"，也就是根据用户输入的内容拼接上".*"（.*表示匹配任意字符零次或多次，可以理解为匹配以用户输入内容开头的任意后续内容）。
接着用str.match(re3)在给定的字符串str中查找匹配re3正则表达式的内容，并将结果打印出来，这里会返回匹配到的以"hello"开头的部分字符串。
2.4、注意事项
转义问题：当通过构造函数传入的字符串模式中包含正则表达式的特殊字符（如\、^、$、*等）时，需要特别注意转义。例如，如果要匹配字符串中实际的\字符，在构造函数的字符串参数里需要写成"\\\\"（因为在字符串里\本身也是转义字符）：

const re4 = new RegExp("\\\\");
// 用于匹配字符串中的反斜杠字符
const strWithBackslash = "This is a \\ character";
const matchResult = strWithBackslash.match(re4);
console.log(matchResult);

与字面量形式对比：虽然构造函数提供了动态创建的灵活性，但对于一些固定的、已知的正则表达式模式，使用字面量形式（如/abc/）往往更加直观、简洁，并且在代码可读性方面可能更好。

总之，RegExp构造函数在需要根据运行时情况灵活构建正则表达式时是非常有用的工具，合理运用它能更好地处理各种文本匹配相关的任务。

三、正则表达式的修饰符

修饰符是可选的，用于指定正则表达式的匹配模式。常见的修饰符包括：

• i：ignoreCase，匹配忽视大小写。
• m：multiline，多行匹配。
• g：global，全局匹配。

1、i 修饰符（忽略大小写）

使用 i 修饰符，正则表达式在匹配时会忽略大小写差异。

const str = "Hello World!";
const regex = /hello/i; // 忽略大小写匹配 "hello"
const match = str.match(regex);
console.log(match); // 输出: [ 'Hello', index: 0, input: 'Hello World!', groups: undefined ]

在这个例子中，即使字符串中的 “Hello” 是大写的，由于使用了 i 修饰符，正则表达式仍然能够匹配到它。

2、m 修饰符（多行匹配）

使用 m 修饰符，正则表达式中的 ^ 和 $ 符号将能够匹配字符串中每一行的开始和结束，而不仅仅是整个字符串的开始和结束。

const str = `Hello
World
!`;
const regex = /^hello$/gm; // 多行匹配，全局匹配，但这里其实不需要全局匹配也能看出效果
const matches = str.match(regex);
// 注意：在没有 `m` 修饰符的情况下，这个正则表达式不会匹配到任何内容，
// 因为 `^` 和 `$` 默认匹配整个字符串的开始和结束。
// 但由于我们的字符串有多行，并且我们使用了 `m` 修饰符，
// 所以这个正则表达式会尝试匹配每一行的开始和结束。
// 然而，这个例子中的正则表达式实际上是不会匹配的，
// 因为我们要求整行必须是 "hello"（忽略大小写也不会匹配），
// 而实际行内容是 "Hello"、"World" 和 "!"。
// 这里只是为了说明 `m` 修饰符的用法，正确的测试应该使用会匹配多行的模式，
// 比如查找每行是否以字母开头。

// 一个更好的例子：
const str2 = `hello
Hello
WORLD
!hello`;
const regex2 = /^hello/img; // 多行匹配，忽略大小写，查找每行是否以 "hello" 开头
const matches2 = str2.match(regex2);
console.log(matches2); // 输出: ["hello", "Hello"]，注意 "WORLD" 不匹配因为不是以小写 h 开头

在这个修正后的例子中，我们使用了 ^hello 并加上了 im 修饰符来匹配每一行是否以 “hello”（忽略大小写）开头。

3、g 修饰符（全局匹配）

使用 g 修饰符，正则表达式将匹配字符串中所有可能的子串，而不是在找到第一个匹配后就停止。

const str = "The quick brown fox jumps over the lazy dog. The dog is quick.";
const regex = /quick/g; // 全局匹配 "quick"
const matches = str.match(regex