正则表达式:
(1). 什么是: 正则表达式就是专门规定一个字符串中字符出现的规律的一套规则。
(2). 何时: 2大类场景
a. 验证字符串格式
b. 查找敏感词
如何在js中创建正则表达式，用于查找和匹配: 2种:
(1). 标准写法:
a. var 变量=new RegExp("正则表达式", "ig")
创建
正则表达式类型的对象
"i" - 忽略大小写
"g"- 全部
b. 何时: 今后只要正则表达式不是固定的，需要根据其他变量值和数组内容动态生成，只能用new RegExp()
(2). 简写:
js地盘 | 正则地盘| js地盘
a. var 变量=/ 正则 /ig ，其实就是new RegExp的简写。
b. 问题: //之中是正则表达式的地盘，只能写正则表达式的语法。不认识js的任何语法！
c. 解决:
1). 只有写死的正则表达式，才能用//创建。
比如: 手机号, 身份证号, 邮箱...
2). 如果正则表达式不是固定的！需要根据其他的变量或数组动态生成！只能用第一种方式拼接字符串！
示例: 查找字符串中符合要求的敏感词
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <title>Document</title>
7 </head>
8 <body>
9 <script>
10 var str="老师:请用小红 我的 朋友造句。小亮:小红是我的朋友。小然:朋友！小红是我的！";
11 //要求: 找出这句话中所有以小字开头的人的名字:小红或小然或小亮
12 //先创建一个正则表达式，包含要找的所有人名
13 //标准写法:
14 // 或 或
15 // var reg=new RegExp("小红|小然|小亮","g");
16 //找所有
17 //简写:
18 // var reg=/小红|小然|小亮/g;
19
20 //用正则查找敏感词
21 // var arr=str.match(reg);
22
23 //如果正则表达式只用一次，不会重复使用
24 //以上两句可合并为一句
25 var arr=str.match(/小红|小然|小亮/g);
26 console.log(arr);
27 </script>
28 </body>
29 </html>
30 运行结果:
31 ["小红", "小亮", "小红", "小然", "小红"]
View Code
示例: 动态替换字符串中规定的敏感词:
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <title>Document</title>
7 </head>
8 <body>
9 <script>
10 //有一个数组集中保存要查找的所有敏感词，而且，要查找的敏感词列表可能随时代不同不断变化。
11 var arr1=["明月","青天"];
12 console.log(arr1.join("|"));
13
14 //希望数组里有什么，就将什么替换为**
15 //先定义正则表达式
16 //错误: //之间不认识js语法
17 // var reg=/arr1.join("|")/g;
18 //正确:
19 var reg=new RegExp(arr1.join("|"),"g");
20 //先有一个字符串:
21 var str="日照香炉生紫烟; 窗前明月光; 一行白鹭上青天";
22 //用正则表达式替换字符串中所有符合要求的敏感词为**
23 var str=str.replace(reg,"**");
24 //输出替换后的新字符串
25 console.log(str);
26 </script>
27 </body>
28 </html>
29 运行结果:
30 明月|青天
31 日照香炉生紫烟; 窗前**光; 一行白鹭上**
View Code
验证:
(1). 什么是: 用正则表达式检查一个字符串的格式是否符合要求
(2). 如何:
a. var 验证结果=正则表达式对象.test(要检查的字符串)
b. 返回值:
1). 如果要检查的字符串格式符合正则表达式要求，则返回true
2). 如果要检查的字符串格式不符合正则表达式要求，则返回false
(3). 坑: test管的很松，只要字符串中包含部分内容和正则表达式匹配，就返回true。而不要求必须从头到尾完全匹配！
比如: /\d{6}/.test("abc123456def") 返回 true
"abcdef123456" 返回 true
(4). 解决: 只要验证格式，都在正则//内，前加^，后加$
(5). 原理: ^表示字符串开头， $表示字符串结尾
^和$一起使用，就有"必须从头到尾完全匹配"的意思
示例: 验证密码格式必须是6位数字
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <title>Document</title>
7 </head>
8 <body>
9 <script>
10 //请用户输入一个密码
11 var pwd=prompt("请输入密码");
12 //定义正则表达式规定密码必须是6位数字
13 //回顾正则:
14 //1位数字: \d digit 数字
15 //6位: {6}
16 var reg=/^\d{6}$/;
17 // 用正则表达式 检查用户输入的字符串
18 var result=reg.test(pwd);
19 //如果验证通过
20 if(result==true){
21 //在控制台输出密码格式正确
22 console.log(`密码格式正确`)
23 }else{//否则
24 //在控制台输出密码格式不正确
25 console.error(`密码格式不正确`)
26 }
27 </script>
28 </body>
29 </html>
View Code
既查找每个敏感词的内容，又查找每个敏感词的位置:
(1). 问题: match最大的问题是只能获得敏感词的内容，无法获得敏感词的位置！
(2). 解决: 只要既想获得敏感词内容，又想获得敏感词位置，都用正则表达式对象的exec()函数
(3). 如何: var 查找结果=正则表达式对象.exec(包含敏感词的字符串);
(4). 强调: 如果想让exec()找所有敏感词，那么正则表达式对象必须加g
(6). 坑: 如果只调用一次exec()，即使正则表达式加了g，也只能返回一个敏感词的内容和位置。无法找到所有敏感词的内容个位置的！
(7). 解决: 只要希望exec()可以查找到所有敏感词的内容和敏感词的位置，必须反复调用exec()——exec()自动去找下一个敏感词，直到找不到,返回null为止。
(8). 固定套路:
var reg=/正则表达式/g;
do{
var result=reg.exec(str);
console.log(result)
}while(result!=null); //只有本次找到了敏感词(result!=null)时才有必要继续找下一个！
(8). exec()的返回值:
a. 如果找到了一个敏感词:
内容 下标位置
var result=[
0: "小红",
index: 5
]
1). 如果想获得结果中的敏感词内容:
标准: result["0"] 简写: result[0]
2). 如果想获得结果中敏感词的位置:
标准: result["index"] 简写: result.index
b. 如果没找到敏感词: null
示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
var str="老师:请用小红 我的 朋友造句。小亮:小红是我的朋友。小然:朋友！小红是我的！";
//要求: 找出这句话中所有以小字开头的人的名字和下标位置:小红或小然或小亮
//先定义正则表达式
var reg=/小红|小亮|小然/g;
//for while do while
//因为当拿到一个字符串时，我们无法提前预见到是否包含敏感词！所以，应该无论是否包含敏感词都能至少查找一次才行！
do{
// 用正则 查找 str中的敏感词
var result=reg.exec(str);
// console.log(result);
//先验证只有本次找到的结果不是null时，才读取结果中的下标位置和敏感词内容
if(result!==null){
//标准:
// console.log(`在${result["index"]}位置，找到敏感词${result["0"]}`);
//简写:
console.log(`在${result.index}位置，找到敏感词${result[0]}`);
}
}while(result!=null); //只有本次找到了敏感词，才有必要继续找下一个！
</script>
</body>
</html>
运行结果:
在5位置，找到敏感词小红
在16位置，找到敏感词小亮
在19位置，找到敏感词小红
在27位置，找到敏感词小然
在33位置，找到敏感词小红
View Code
