本文学习JavaScript正则表达式，内容很复杂，但是现在AI流行的情况下，完全可以让AI写，但是作为开发人员，还是必须懂这些内容的

什么是正则表达式#

正则表达式（regular expression）描述了字符串的“构成模式”，经常被用于检查字符串是否符合预定的格式要求

快速感知正则表达式

用一个例子快速演示正则表达式基本使用方法：检查某个字符串是否是6位数字

1
// 要检查的字符串
2
var str = '456789';
3
// 正则表达式规则
4
var regexp = /^\d{6}$/;///^\d{6}$/就是正则表达式，，它描述了字符串必须是“6位数字”的构成规则
5
// 检查
6
if (regexp.test(str)) {//正则表达式可以调用test()方法，检查某字符串是否符合正则表达式规定的规则
7
  //alert('符合规则');
8
  console.log('符合规则');
9
} else {
10
  //alert('不符合规则');
11
  console.log('不符合规则');
12
}

正则表达式“按位”描述规则

正则表达式“按位”描述规则，是指它是一位一位的描述字符串的构成形式
比如检查字符串是不是这样的：以字母m开头，然后是3个数字，最后以字母n结尾
```
1
/^m\d\d\dn$/   //^表示开头，$表示结尾，\d表示数字\d\d\d也可以写作\d{3}
```

正则表达式的创建#

使用/内容/的语法形式，可以快速创建正则表达式
也可以使用new RegExp(‘内容’)的形式，创建正则表达式

使用typeof运算符检查正则表达式的类型，结果是object

1
var regexp1 = /^\d{6}$/;
2
var regexp2 = new RegExp('^\\d{6}$');
3

4
var str = '123456';
5

6
console.log(regexp1.test(str));
7
console.log(regexp2.test(str));

元字符#

元字符”是指一位指定类型的字符

元字符	功能
\d	匹配一个数字
\D	匹配一个非数字字符
\w	匹配一个单字字符（字母、数字或者下划线）
\W	匹配一个非单字字符
\s	匹配一个空白字符，包括空格、制表符和换行符
.	任意字符

开头和结尾

元字符	功能
^	匹配开头
$	匹配结尾

元字符注意事项

如果使用new RegExp()写法，反斜杠需要多写一个
比如/^\d$/和new RegExp('^\\d$')是相同的意思

元字符使用举例

某快递公司运单号形式是这样的：123-4567-890，请使用正则表达式检查某字符串是否符合此格式

1
const reg = /^\d{3}-\d{4}-\d{3}$/;
2

3
console.log(reg.test("123-4567-890")); // true
4
console.log(reg.test("12-4567-890"));   // false
5
console.log(reg.test("123-456-890"));   // false
6
console.log(reg.test("123-4567-8901")); // false

某产品的验证秘钥形式是这样的：□□□-□□□□-□□□，其中□ 表示字母数字或者下划线，请使用正则表达式检查某字符串是否符合此格式

1
const reg = /^[A-Za-z0-9_]{3}-[A-Za-z0-9_]{4}-[A-Za-z0-9_]{3}$/;
2

3
console.log(reg.test("a1_-B2c3-9Zx"));   // true
4
console.log(reg.test("abc-1234-xyz"));   // true
5
console.log(reg.test("ab-1234-xyz"));    // false（第一段少1位）
6
console.log(reg.test("abc-123-xyz"));    // false（第二段少1位）
7
console.log(reg.test("abc1234xyz"));     // false（缺少 -）

字符的转义

在特殊字符之前的反斜杠\表示下一个字符不是特殊字符，应该按照字面理解

1
/^.$/ 检查字符串是不是任意字符
2
/^\.$/检查字符串是不是一个点
3
/^\\$/检查字符串是不是一个反斜杠

不管一个符号有没有特殊意义，都可以在其之前加上一个\以确保它表达的是这个符号本身

举例：某产品批号形式为：123.45^67#89，请使用正则表达式检查某字符串是否符合此格式

1
const reg = /^\d{3}\.\d{2}\^\d{2}#\d{2}$/;
2

3
console.log(reg.test("123.45^67#89")); // true
4
console.log(reg.test("12.45^67#89"));  // false
5
console.log(reg.test("123.4^67#89"));  // false
6
console.log(reg.test("123.45^67#890")); // false
7
console.log(reg.test("abc.45^67#89"));  // false

方括号表示法#

使用方括号，比如[xyz]，可以创建一个字符集合，表示匹配方括号中的任意字符
比如某学校的学号规定：第1位是一个字母，b表示本科生， y表示研究生，后面是7位数字，用正则表示为：
```
1
/^[by]\d{7}$/
```
可以使用短横-来指定一个字符范围，^表示否定

元字符	等价的方括号表示法
\d	[0-9]
\D	0-9
\w	[A-Za-z0-9_]
\W	A-Za-z0-9_

请验证某字符串是否是5位字母，大小写均可

1
const reg = /^[A-Za-z]{5}$/;
2

3
console.log(reg.test("abcde")); // true
4
console.log(reg.test("ABCDE")); // true
5
console.log(reg.test("AbCdE")); // true
6

7
console.log(reg.test("abcd"));   // false（少1位）
8
console.log(reg.test("abcdef"));  // false（多1位）
9
console.log(reg.test("abc12"));   // false（含数字）
10
console.log(reg.test("abc_d"));   // false（含下划线）

请验证某字符串是否是5位，且仅有小写字母、点构成

1
const reg = /^[a-z.]{5}$/;
2

3
console.log(reg.test("abcde")); // true
4
console.log(reg.test("a.b.c"));  // true
5
console.log(reg.test("ab.cd"));  // true
6

7
console.log(reg.test("ABcde"));  // false（有大写）
8
console.log(reg.test("abc12"));  // false（有数字）
9
console.log(reg.test("abcd"));    // false（少1位）
10
console.log(reg.test("abcdef"));  // false（多1位）
11
console.log(reg.test("abc_d"));   // false（有下划线）

请验证某字符串是否是4位小写字母，且最后一位不能是m字母

1
const reg = /^[a-z]{3}[a-ln-z]$/;
2

3
console.log(reg.test("abcd")); // true
4
console.log(reg.test("abcz")); // true
5
console.log(reg.test("abcm")); // false ❌（最后是m）
6

7
console.log(reg.test("abc"));  // false（少1位）
8
console.log(reg.test("abcde")); // false（多1位）

量词#

量词	意义
*	匹配前一个表达式0次或多次。等价于{0,}
+	匹配前面一个表达式1次或者多次。等价于{1,}
?	匹配前面一个表达式0次或者1次。等价于{0,1}
{n}	n是一个正整数，匹配了前面一个字符刚好出现了n次
{n,}	n是一个正整数，匹配前一个字符至少出现了n次
.{n,m}	n和m都是整数。匹配前面的字符至少n次，最多m次

请验证字符串是否符合手机号码的规则：11位数字，并且肯定以1开头

1
const reg = /^1\d{10}$/;
2

3
console.log(reg.test("13812345678")); // true
4
console.log(reg.test("19876543210")); // true
5

6
console.log(reg.test("23812345678")); // false（不是1开头）
7
console.log(reg.test("1381234567"));  // false（少1位）
8
console.log(reg.test("138123456789")); // false（多1位）
9
console.log(reg.test("1a812345678"));  // false（含字母）

请验证某字符串是否是这样的：以字母开头，中间是任意位数字（最少1位）构成，并以字母结尾

1
const reg = /^[A-Za-z]\d+[A-Za-z]$/;
2

3
console.log(reg.test("a123b"));   // true
4
console.log(reg.test("Z9x"));     // true
5

6
console.log(reg.test("a1"));      // false（结尾不是字母）
7
console.log(reg.test("123a"));    // false（开头不是字母）
8
console.log(reg.test("a12b3"));   // false（结尾不是字母）
9
console.log(reg.test("ab"));      // false（中间没有数字）

请验证某字符串是否符合网址规则：以www.开头，中间是任意位的字符（字母数字下划线），最后以.com结尾，也可以以.com.cn结尾

1
const reg = /^www\.\w+(?:\.com|\.com\.cn)$/;
2

3
console.log(reg.test("www.baidu.com"));      // true
4
console.log(reg.test("www_baidu.com.cn"));   // true
5
console.log(reg.test("www_abc123.com"));     // true
6

7
console.log(reg.test("http://www.baidu.com"));// false（多了http）
8
console.log(reg.test("www.baidu.net"));       // false（不支持.net）
9
console.log(reg.test("www..com"));            // false（中间为空）
10
console.log(reg.test("ww.baidu.com"));        // false（不是www开头）

修饰符#

修饰符也叫作标志（flags），用于使用正则表达式实现高级搜索

修饰符	意义
i	不区分大小写搜索
g	全局搜索

修饰符的使用：

1
var re = /m/gi; //在正则表达式的第二个/后面写修饰符，可以多个连写
2

3
var re = new RegExp('m','gi');//new RegExp()形式的正则表达式，以字符串形式写在第二个参数

正则表达式的相关方法#

正则表达式可以“打点”调用哪些方法呢？

方法	简介
test()	测试某字符串是否匹配正则表达式，返回布尔值
exec()	根据正则表达式，在字符串中进行查找，返回结果数组或者null

test()方法

正则表达式的test()方法用来测试某字符串是否匹配此正则表达式，它返回true或false
```
1
/^[a-z]{3}[a-ln-z]$/.test('abcd')
```

exec()

exec()方法功能是：在一个指定字符串中执行一个搜索匹配查找，返回一个结果数组或null
```
1
var str ='abc123def456ghi789';
2
var regexp = /\d+/;
3
var result1 = regexp.exec(str);
```

exec()方法的逐条遍历

exec()方法最有趣的是，有“g”修饰符的正则表达式将自动成为“有状态”的，这意味着可以对单个字符串中的多次匹配结果进行逐条的遍历

1
var str ='abc123def456ghi789';
2
var regexp = /\d+/g; // 有g修饰符
3
var result1 = regexp.exec(str);
4
var result2 = regexp.exec(str);
5
var result3 = regexp.exec(str);
6
var result4 = regexp.exec(str);
7
console.log(result1);
8
console.log(result2);
9
console.log(result3);
10
console.log(result4);

1
var str ='abc123def456ghi789';
2
var regexp = /\d+/g; // 有g修饰符
3
var result;
4
while (result = regexp.exec(str)) {
5
  console.log(result);
6
}

字符串的相关正则方法#

字符串有哪些方法可以使用正则表达式呢？

方法	简介
search()	在字符串中根据正则表达式进行查找匹配，返回首次匹配到的位置索引，测试不到则返回-1
match()	在字符串中根据正则表达式进行查找匹配，返回一个数组，找不到则返回null
replace()	使用替换字符串替换掉匹配到的子字符串，可以使用正则表达式
split()	分隔字符串为数组，可以使用正则表达式

正则表达式的应用#

用正则表达式进行表单验证

用正则表达式进行表单验证是正则表达式最重要的实际应用
实际上，很多正则表达式不需要我们自己写，可以通过搜索引擎和AI查找，可以拿来即用

音乐

音乐