2025第1周 | JavaScript中的正则表达式

2025，做想做的事，读想读的书，持续学习，自律生活，修行人生。

2025一个转身就已到来，对于时间太快，总会有种惶恐感。每每回首过去，总会发现想要做的事情没有完成，学习的内容少之又少，读的有用的书籍更是可以忽略不计。对于内在的超越，内在的修行也是没有始终践行，知行合一，实践、认识、再实践、再认识…

2025年第1周：2025.01.01 ~ 2025.01.05

目标：JavaScript中的正则表达式，您搞懂了么？这部分内容，不需要深入了了解，但是基本的概念和用法需要掌握。

• 正则表达式是个什么东东？
• 怎么使用？
• 规则有哪些

1. 正则表达式是个什么东东？

我们看一下百度百科上的解释：

正则表达式（Regular Expression）：又称规则表达式，在代码中常简写为regex、regexp或RE 。正则表达式使用单个字符串来描述、匹配一系列匹配某个句法规则的字符串，通常被用来检索、替换那些符合某个模式（规则）的文本。许多程序设计语言都支持利用正则表达式进行字符串操作。

读了半天，还是懵，说的什么东东？

其实就一句话：在JavaScript中，就是用来进行字符串匹配的，进行搜索、获取、替代字符串。

1.1 怎么定义正则

那么，怎么定义正则呢？有两种方式来定义正则：

1. 对象字面量方式(常用)
2. 使用类RegExp创建

正则有两部分构成：模式、和修饰符。

1.2 对象字面量方式

• 这里面xxx：为模式
• ig：为修饰符

// 对象字面量方式创建正则
const regexp = /xxx/ig

1.3 类创建方式

• 使用RegExp 类来创建

const regexp = new RegExp("xxx", "ig")

2. 怎么使用

有了正则表达式之后，我们要如何使用它呢? 在JavaScript中，主要用于以下两个场景：

1. 类RegExp的实例方法：exec、和 test 方法
2. 字符串的方法：match/matchAll、replace/replaceAll、search、split 方法。

2.1 实例方法

2.1.1 exec方法

• exec方法：使用正则，执行一个字符串。

const re1 = /qtz/ig; 
const message = "welcom to qtz";const result = re1.exec(message);
console.log(result);// [ 'qtz', index: 10, input: 'welcom to qtz', groups: undefined ]

2.1.2 test方法

test方法：检测某一个字符串是否符合正则的规则。返回boolean类型。

const regexp = /qtz/ig
const str = "welcome to qtz"
if (regexp.test(str)) {console.log("匹配到了qtz")
}

2.2 字符串中的方法

2.2.1 match/matchAll

• 注意：matchAll传入的正则修饰符，必须加g，否则会报如下错误：

Uncaught TypeError: String.prototype.matchAll called with a non-global RegExp argument

• matchAll 返回值：得到是一个迭代器对象(RegExpStringIterator{})

const re = /qtz/ig; 
const message = "Qtz and qtz or qtz";const result = message.matchAll(re);console.log(result.next()); 
console.log(result.next());
console.log(result.next());

2.2.2 replace/replaceAll

• 替换字符串

const re1 = /qtz/ig; 
const message = "Qtz and qtz or qtz";const result = message.replace(re1, "AAA");
console.log(result);    // AAA and AAA or AAA

2.2.3 split

• 字符串分割

const reg = /qtz/ig; 
const message = "Qtz and qtz or qtz";const result = message.split(reg);
console.log(result);   // [ '', ' and ', ' or ', '' ]

2.2.4 search

• 查找字符串

const reg = /qtz/i; 
const message = "HH Qtz and qtz or qtz";const result = message.search(reg);
console.log(result);  // 3

3. 规则

3.1 修饰符

• g：全局，匹配所有
• i：忽略大小写
• m：多行匹配

3.2 字符类

字符类(Character classes)是一个特殊的符号，匹配特定集中的任何符号：

• \d ：数字从0到9的字符
• \s：空格符号，包括空格、制表符 \t、换行符\n 和其他少数稀有字符，例如 \v、\f和 \r。
• \w：'单字"字符，拉丁字母、数字、下划线-。相当于 [ a-zA-Z0-9_ ]
• .(点)：点 . 是一种特殊字符类，它与“除换行符之外的任何字符”匹配.

反向类(Inverse classes)

• \D 非数字：除 \d 以外的任何字符，例如字母,
• \S 非空格符号：除\s 以外的任何字符，例如字母。
• \W 非单字字符：除 \w 以外的任何字符，例如非拉丁字母或空格,

3.3 锚点(Anchors)

符号^和符号 $ 在正则表达式中具有特殊的意义，它们被称为“锚点”。

• 符号 ^ 匹配文本开头;
• 符号 $ 匹配文本末尾,

词边界(Word boundary)

• 词边界 \b 是一种检査，就像 ^和$ 一样，它会检査字符串中的位置是否是词边界。
• 词边界测试 \b 检査位置的一侧是否匹配 \w，而另一侧则不匹配“\w“

3.4 转义字符串

如果要把特殊字符作为常规字符来使用，需要对其进行转义

• 只需要在它前面加个反斜杠 \

常见的需要转义的字符:

[ ] \ ^ $ . | ? * + ( )

• 斜杠符号 / 并不是一个特殊符号，但是在字面量正则表达式中也需要转义;

const re = /\//

3.5 集合(Sets)和范围(Ranges)

有时候我们只要选择多个匹配字符的其中之一就可以：

• 在方括号 [...] 中的几个字符或者字符类意味着“搜索给定的字符中的任意一个”.

集合(Sets)

• 比如说，[eao] 意味着查找在3个字符’a’、'e’或者、'o’中的任意一个;

范围(Ranges)：方括号也可以包含字符范围

• 比如说，[a-z]会匹配从 a到z范围内的字母，[0-5]表示从05的数字;
• [0-9A-F]表示两个范围:它搜索一个字符，满足数字 0 到 9 或字母 A 到 F
• \d ：和 [0-9]相同;
• \w：和 [a-zA-Z0-9_]相同;

3.6 量词

用来形容我们所需要的数量的词被称为量词(quantifiers)。

数量 {n}

• 确切的位数：{5}
• 某个范围的位数：{3,5} 注意,号后面不能有空格

简写:

• +：代表“一个或多个”，相当于{1,}
• ?：代表“零个或一个”，相当于(0,1}。换句话说，它使得符号变得可选;
• *：代表着“零个或多个”，相当于{0,}。也就是说，这个字符可以多次出现或不出现;

3.7 捕获组

1. 模式的一部分可以用括号括起来(.)，这称为“捕获组。这有两个作用:

• 它允许将匹配的一部分作为结果数组中的单独项，
• 它将括号视为一个整体;

2. 命名组:

• 用数字索引记录组很困难。
• 对于更复杂的模式，计算括号很不方便。我们有一个更好的选择：给括号起个名字。
• 这是通过在开始括号之后立即放置?<name>来完成的。

3. 非捕获组:

• 有时我们需要括号才能正确应用量词，但我们不希望它们的内容出现在结果中。
• 可以通过在开头添加 ?:来排除组。

4. 或

• 在正则表达式中，它用竖线|表示，
• 通常会和捕获组一起来使用，在其中表示多个值
• 与[aeo]的区别：中括号是单个字符

3.8 贪婪模式和惰性模式

默认情况下的匹配规则：是查找到匹配的内容后，会继续向后查找，一直找到最后一个匹配的内容

• 这种匹配的方式，我们称之为贪婪模式

懒性模式中的量词与贪婪模式中的是相反的。

• 只要获取到对应的内容后，就不再继续向后匹配
• 我们可以在量词后面再加一个问号?来启用它
• 所以匹配模式变为 *?或 +?，甚至将?变为 ??

END !