正则表达式（第二期）
八、元字符的使用
let str = 'csdn￥#%';
console.log(str.match(/./)[0]);//"."可以匹配除了换行符之外的所有字符，会输出c
console.log(str.match(/.+/)[0]);//写"+"进行贪婪，输出csdn￥#%
//如果要匹配点号，就要通过\.进行转义
let url = 'http://www.baidu.com';
console.log(url.match(/https?:\/\/\w+\.\w+\.\w+/)[0]);//?表示可以有s或者没有s，最终输出http://www.baidu.com
//.不能匹配换行符，遇到换行符就会停止匹配
//用模板字符定义
let text = `
baidu.com
baidu.com
`
console.log(text.match(/.+/)[0])//遇到第一个baidu.com的换行之后就停止了，所以只会输出第一个baidu.com
//最后讲一个空格，空格与普通字符一样，直接输入空格进行匹配，或者通过\s进行匹配
let phone = "010 - 999999";
console.log(/\d+ - \d+/.test(phone));//输出true
console.log(/\d+\s-\s\d+/.test(phone));//输出true
九、匹配所有字符
"." 匹配除了换行符以外的所有字符；
"\d"匹配数字；
"\w"匹配数字、字母、下划线；
[\s\S]、[\d\D]、[\w\W]表示可以匹配所有字符！！！
//通过[\s\S]匹配所有字符
let str = "faskllsf;hajkmvnpaf[l31q@#@$!";
console.log(str.match(/[\s\S]+/)[0]);//输出faskllsf;hajkmvnpaf[l31q@#@$!
//通过[\d\D]匹配所有字符
let strs = "faskllsf;hajkmvnpaf[l31q@#@$!";
console.log(strs.match(/[\d\D]+/)[0]);//输出faskllsf;hajkmvnpaf[l31q@#@$!
//通过[\w\W]匹配所有字符
let str1 = "faskllsf;hajkmvnpaf[l31q@#@$!";
console.log(str1.match(/[\w\W]+/)[0]);//输出faskllsf;hajkmvnpaf[l31q@#@$!
十、i、g模式修正符
let str = 'Daidai';
//i模式不区分大小写
console.log(str.match(/d/i)[0]);//输出D
//g模式进行贪婪搜索全局
console.log(str.match(/d/g)[0]);//输出d
//g和i模式组合搜索全局并不区分大小写（g和i的顺序可以改变）
console.log(str.match(/d/gi));//输出['D'、'd']
console.log(str.match(/d/ig));//输出['D'、'd']
十一、m多行匹配修正符
//希望通过正则得到一个数组，包括课程name和价格price->[{name:'',price:''}]（去掉不符合规范的行-第三行）
let str = `
#1 js,120 #
#2 vue,120 #
#4 前端 # 戴
#3 react,120 #
`
//*表示0个或多个,m表示每一行单独处理
console.log(str.match(/^\s*#\d+\s+.+\s+#$/gm)[0]);//输出0: "\n #1 js,120 #" 1: " #2 vue,120 #" 2: " #3 react,120 #"
let lesson = str.match(/^\s*#\d+\s+.+\s+#$/gm).map(e => {
//将空格和#去掉
e = e.replace(/\s*#\d+\s*/, '').replace(/#/, '');
//解构
[name, price] = e.split(',');
return { name, price }
})
console.log(lesson);//输出数组
十二、汉字与字符属性
//\p表示字符属性，{属性值}，必须需要用u模式进行匹配
let str = "csdn2021,加油";
//L表示匹配字符
console.log(str.match(/\p{L}/gu));//输出['c', 's', 'd', 'n', '加', '油']
//P表示匹配标点符号
console.log(str.match(/\p{P}/gu));//输出[',']
//Script=>sc，比如查找中文
console.log(str.match(/\p{sc=Han}/gu))//输出['加', '油']
//也可以使用\u4e00-\u9fa5
console.log(str.match(/[\u4e00-\u9fa5]/g))//输出['加', '油']
//如果有宽字节的匹配时，使用u进行匹配
let text = "xy";
console.log(text.match(/[xy]/gu))//输出['x', 'y']
十三、lastindex属性
let str = "csdn";
console.log(str.match(/\w/));//输出['c', index: 0, input: 'csdn', groups: undefined]，并且有很多属性
console.log(str.match(/\w/g));//输出['c', 's', 'd', 'n']，属性消失
//如果我们要保留所有属性，就要使用exec
const reg = /\w/g;
//因为正则中有一个lastindex，都会被记录
console.log(reg.lastIndex)//0
console.log(reg.exec(str))//输出['c', index: 0, input: 'csdn', groups: undefined]
console.log(reg.lastIndex)//1
console.log(reg.exec(str))//输出['s', index: 1, input: 'csdn', groups: undefined]
console.log(reg.lastIndex)//2
console.log(reg.exec(str))//输出['d', index: 2, input: 'csdn', groups: undefined]
console.log(reg.lastIndex)//3
console.log(reg.exec(str))//输出['n', index: 3, input: 'csdn', groups: undefined]
十四、有效率的y模式
let str = "csdnc";
//如果使用g模式，不需要连续满足这个条件，可以跳过不满足的继续往后面找
let reg = /c/g;
console.log(reg.exec(str))//输出['c', index: 0, input: 'csdnc', groups: undefined]
console.log(reg.lastIndex)//输出1
console.log(reg.exec(str))//输出['c', index: 4, input: 'csdnc', groups: undefined]
console.log(reg.lastIndex)//输出5
console.log(reg.exec(str))//输出null
console.log(reg.lastIndex)//输出0
//如果使用y模式，如果连续不满足这个条件，就输出null，回到第一个
let reg1 = /c/y;
console.log(reg1.exec(str))//输出['c', index: 0, input: 'csdnc', groups: undefined]
console.log(reg1.lastIndex)//输出1
console.log(reg1.exec(str))//输出null
console.log(reg1.lastIndex)//输出0
//使用y模式，检索大文档的时候效率更高
let strs = "QQ群号为11111111,2222222,33333333,csdn";
let regs = /(\d+),?/y;
regs.lastIndex = 5;
let qq = [];
while (res = regs.exec(strs)) {
qq.push(res[1])
}
console.log(qq)//输出['11111111', '2222222', '33333333']
十五、原子表
let str = "csdncsdn";
console.log(str.match(/[dn]/g));//输出 ['d', 'n', 'd', 'n']
//生日的匹配
let birth = "2000-08-20";
console.log(birth.match(/\d{4}-\d{2}-\d{2}/));//输出['2000-08-20', index: 0, input: '2000-08-20', groups: undefined]
//如果日期中间不是-可能是/
let birth1 = "2000/08/20";
console.log(birth1.match(/\d{4}[-/]\d{2}[-/]\d{2}/));//输出['2000/08/20', index: 0, input: '2000/08/20', groups: undefined]
//但是如果是2000-08/20也是可以的，所以是有问题，这里提前引入一个原子组的效果
let birth2 = "2000/08-20";
console.log(birth2.match(/\d{4}([-/])\d{2}\1\d{2}/));//输出null
十六、区间匹配
let str = "2021";
console.log(str.match(/\d+/));//输出['2021', index: 0, input: '2021', groups: undefined]
console.log(str.match(/[0-9]+/));//输出['2021', index: 0, input: '2021', groups: undefined]
let str1 = "csdn";
console.log(str1.match(/[a-z]+/));//输出['csdn', index: 0, input: 'csdn', groups: undefined]
实操练习：
需求——验证账号是否符合以下条件（不满足会进行提示）：
1、以字母开头
2、长度为4-7位
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>正则表达式-实操</title>
</head>
<body>
<input type="text" name="input">
<script>
let input = document.querySelector(`[name="input"]`);
let span = document.createElement('span');
document.body.appendChild(span)
input.addEventListener('keyup', function () {
let reg = new RegExp('^[a-z]\\w{3,6}$', 'i');
if (reg.test(this.value) === true) {
span.innerHTML = "正确"
} else {
span.innerHTML = "错误"
}
})
</script>
</body>
</html>
十七、排除匹配
//排除匹配
let str = "csdn";
console.log(str.match(/[^c]/g));//排除c，输出['s', 'd', 'n']
//查找中文
let strs = "csdn2020,加油";
console.log(strs.match(/[^\w,]/g))//排除字符、数字、下划线，输出['加', '油']
由于正则表达式的内容有些多，我会分五期给大家讲清楚，此文章与动手练习配合效果最为显著。正则表达式也是许多公司（大厂）必考题！！！
我会将自己平时项目中常见的问题以及笔试面试的知识在优快云与大家分享，一起进步，加油。
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
