【JavaScript正则表达式指南】——正则表达式入门：创建、方法与标志详解

摘要 本文主要介绍了正则表达式的创建，RegExp对象提供的方法和String对象提供的方法。还对基础的标志进行了讲解和举例。

1. 正则表达式介绍

正则表达式（Regular Expression，简称RegExp）是一种用于匹配和操作文本的强大工具，它是由一系列字符和特殊字符组成的模式，用于描述要匹配的文本模式。

2. 创建正则表达式

在JavaScript中内置了RegExp对象，正则表达式可以使用字面量创建也可以使用RegExp构造函数创建。RegExp主要分为两个部分，pattern和flags。pattern是匹配模式，flags是匹配模式中的标志。

字面量创建 使用两个 / 包裹pattern(像双引号一样)创建正则表达式。

let reg=/pattern/flags；
let reg=/a/i;//匹配字母a，不区分大小写

RegExp构造函数创建

从下图接口可知,pattern可以是RegExp也可以是string，flags则要求string。

let reg=new RegExp(pattern,flags);
let reg=new RegExp("a", "i"); // pattern为字符串
let reg=new RegExp(/a/, "i"); // pattern为正则表达式

3. 基础的正则表达式

匹配模式中单个字符如/a/是最基础的，匹配到有这个a字符在内就会匹配成功与a字符位置无关。

匹配多个字符时如/abc/,在有abc相连的字符串在内中，就会匹配成功与abc字符串位置无关。

若需匹配特殊字符本身（如.、*、+、?、()、[]），必须在其前加\转义等，需要使用反斜杠进行转义。

默认情况下只会匹配一次。test方法中要匹配的字符串作为参数，如果匹配成功就返回true,说明传入的字符串满足该正则表达式，否则返回false。

let reg=/a/;//匹配字母a
console.log(reg.test("a"));//true
console.log(reg.test("aaa"));//true 实际只匹配了第一个a就返回了结果
console.log(reg.test("bab"));//true
console.log(reg.test("b"));//false

//?用于代表一个字符，可以是1 abc1
let reg=/abc/;//匹配字符串abc 要求有相连的abc字符串
console.log(reg.test('abc'));//true
console.log(reg.test('ab?c'));//false
console.log(reg.test('abc?'));//true 
console.log(reg.test('?abc'));//true
console.log(reg.test('?abc?'));//true
console.log(reg.test('?abb?'));//false


let reg=/\//;
console.log(reg.test('/path'));//true

4. RegExp提供的方法

RegExp对象提供了一些方法，用于匹配和操作文本。使用形式RegExp.method()。

RegExp.test()：匹配字符串，返回匹配boolean类型结果 true/false。

let reg=/a/;//匹配字母a
console.log(reg.test("a"));//true
console.log(reg.test("b"));//false

RegExp.exec()：匹配字符串，返回匹配结果（数组）。

let reg=/a/;
console.log(reg.exec("a"));//[ 'a', index: 0, input: 'a', groups: undefined ]，
                           // 匹配到的字符串，索引，输入字符串，匹配的分组 
console.log(reg.exec("b"));//null

5. String提供的方法

String对象提供一些方法，用于匹配和操作文本。使用形式String.method()。

String.match()：匹配字符串，返回匹配结果（数组）。

let reg=/a/;
let str="aaa";
console.log(str.match(reg));//[ 'a', index: 0, input: 'aaa', groups: undefined ] 
                            // 在非全局匹配情况下，返回结果与exec()相同。

--全局匹配将会在下文的标志版块中介绍。

String.replace()：替换字符串，返回替换后的字符串。

let reg=/a/;
let str="aaa";
console.log(str.replace(reg, "b"));//baa 在非全局匹配情况下，只替换第一个匹配到的字符。

String.search()：搜索字符串，返回匹配的索引。

let reg=/a/;
let str="bba";
console.log(str.search(reg));//2 返回了索引2

String.split()：分割字符串，返回分割后的数组。

let reg=/a/;
let str="bac";
console.log(str.split(reg));//[ 'b', 'c' ] 从a开始分割成左侧和右侧，返回的数组中不包含a。

6. 模式标志

标志也叫模式修正符，是更改搜索行为的设置。 i（ignore case）:忽略大小写。大写和对应的小写字母都会匹配上。

let reg=/a/i;
console.log(reg.test("a"));//true
console.log(reg.test("A"));//true

let reg=/A/i;
console.log(reg.test("a"));//true
console.log(reg.test("A"));//true

g（global）:全局匹配。不会只匹配一次就结束，会进行全文匹配找到所有匹配项。 --使用replace()结果更加直观

let reg=/a/;
let reg1=/a/g;
let str="abcabcabc";
console.log(str.replace(reg,"1"));//1bcabcabc 没有使用全局匹配
console.log(str.replace(reg1,"1"));//1bc1bc1bc 使用了全局匹配

以下有还有些标志，但其中包括了其他内容，我们不在本文介绍。

• m（multiline）:多行模式。
• s（single line）:单行模式。
• u（unicode）:unicode模式
• y（sticky）:粘性匹配
• x（extended）:扩展模式

标志还可以组合使用,组合没有先后顺序，ig和gi效果一样

let reg=/a/gi;//忽略大小写和全局匹配
let str="abcABCabc";
console.log(str.replace(reg,"1"));//1bc1BC1bc

7. 题目

可以解答以下题目来巩固知识

题目 1： 现有字符串 const str = "Hello World! This is a Test. I love JavaScript."，请使用 test() 方法判断该字符串是否包含 "test"（不区分大小写），并输出结果。

题目 2： 现有字符串 const str = "2024-05-20 14:30:00|今天天气晴朗,适合出游"，请使用 split() 结合正则，按 -、（空格）、:(冒号)、|、, 这几种符号分割字符串，最终得到所有 "独立元素" 的数组。

题目 3： 现有字符串 const str = "I like Apple, and I ate an apple yesterday. My favorite is APPLE!"，请使用 replace() 结合 g 和 i 标志，将字符串中所有的 "apple"（不区分大小写，包括 Apple、APPLE 等）替换为 "orange"，并输出替换后的完整字符串。