本文已参与「新人创作礼」活动， 一起开启掘金创作之路。
正则表达式
正则表达式介绍
正则表达式是用于匹配字符串中字符组合的模式
正则表达式作用:
表单验证（匹配）
过滤敏感词（替换）
字符串中提取我们想要的部分（提取)
正则表达式基本使用
正则表达式以斜杠开始，斜杠结束 // 里面填写规则
正则表达式使用分为几步？
01-定义正则表达式
02-检测查找是否匹配
test() 方法
exec() 方法 在一个指定字符串中执行一个搜索匹配
匹配成功,返回的是一个true,否则为false
const str = '你好前端，你好Java，你好Python'
// 正则表达式使用：
// 需求：看看 str 中是否包含 前端
// 1. 定义正则表达式
const reg = /前端/
// console.log(typeof reg)
// 2. 使用正则对象 正则对象.test(要验证的字符串)
console.log(reg.test(str))
exec()方法
exec() 方法 在一个指定字符串中执行一个搜索匹配
匹配成功,返回的是一个数组,否则返回null
元字符
边界符
^表示必须以什么开头 ： /^5/表示必须以5开头
/表示必须以5结束
当^和$同时出现表示精确匹配
// 1. 边界符
// ^ 表示 以 xxx开头
console.log(/^哈/.test('哈')) // true
console.log(/^哈/.test('哈哈')) // true
console.log(/^哈/.test('二哈')) // flase
// $ 表示 以 xxx结尾
// true 只有这种情况为true 否则全是false
console.log(/^哈$/.test('哈'))
// 如果 ^ 和 $ 在一起，必须是精确匹配
console.log(/^哈$/.test('哈哈')) // false
console.log(/^哈$/.test('二哈')) // false
// 手机号码 必须以 数字 1开头
// ^ 表示 以 xxx开头
console.log(/^1/.test('1234')); // 表示以1开头
console.log(/^1/.test('234')); // 表示以1开头
console.log(/1$/.test('234')); // 表示字符串必须是以 1结尾
量词
可以重复的次数
量词 *
***** 表示 可以有也可以没有
类似 >=0 次
量词+
+ 表示 最少有1次 类似 >=1 次
量词?
? 表示 重复 0 次或者 一次
量词{n}
量词 {n} 写几，就必须出现几次
量词 {n,}
量词 {n,} 就是>=n ，必须出现大于等于n次
量词{n,m}
{n,m} 逗号左右两侧千万不能有空格 >=n && <= m 必须出现大于等于n次小于等于m次
字符类
[ ] 匹配字符集合
[] 表示 匹配 里面的任意一个字符
// [] 表示 匹配 里面的任意一个字符
console.log(/[abcd]/.test('abcd')) // true
console.log(/^[abcd]$/.test('abcd')) // false
console.log(/^[abcd]$/.test('b')) // true
console.log(/^[abcd]$/.test('c')) // true
console.log(/^[abcd]$/.test('ehfg')) // false
console.log(/^[abc]{2}$/.test('ab'))// true
连字符-
使用连字符 - 表示一个范围
// [a-z]表示 匹配 必须以 小写字母 a-z
console.log(/^[a-z]$/.test('a')) // true
console.log(/^[A-Z]$/.test('a')) // false
console.log(/^[0-9]$/.test(2))//true
console.log(/^[a-zA-Z0-9]$/.test(0))//true
[^]
当[]里面添加^时，表示取反 比如 [^a-z] 表示除了a-z都匹配
字符类-预定义
\d 匹配一个数字字符。等价于[0-9]。 \D 匹配一个非数字字符。等价于0-9。 \f 匹配一个换页符。等价于\x0c和\cL。 \n 匹配一个换行符。等价于\x0a和\cJ。 \r 匹配一个回车符。等价于\x0d和\cM。 \s 匹配任何空白字符，包括空格、制表符、换页符等等。等价于[ \f\n\r\t\v]。 \S 匹配任何非空白字符。等价于 \f\n\r\t\v。 \t 匹配一个制表符。等价于\x09和\cI。 \v 匹配一个垂直制表符。等价于\x0b和\cK。 \w 匹配包括下划线的任何单词字符。等价于“ [A-Za-z0-9_]”。\W 匹配任何非单词字符。等价于“ [^A-Za-z0-9_]”。\xn 匹配n，其中n为十六进制转义值。十六进制转义值必须为确定的两个数字长。例如，“ \x41”匹配“A”。“\x041”则等价于“\x04&1”。正则表达式中可以使用ASCII编码。.num 匹配num，其中num是一个正整数。对所获取的匹配的引用。例如，“ (.)\1”匹配两个连续的相同字符。n 标识一个八进制转义值或一个向后引用。如果n之前至少n个获取的子表达式，则n为向后引用。否则，如果n为八进制数字（0-7），则n为一个八进制转义值。 nm 标识一个八进制转义值或一个向后引用。如果nm之前至少有nm个获得子表达式，则nm为向后引用。如果nm之前至少有n个获取，则n为一个后跟文字m的向后引用。如果前面的条件都不满足，若n和m均为八进制数字（0-7），则nm将匹配八进制转义值nm。 nml 如果n为八进制数字（0-3），且m和l均为八进制数字（0-7），则匹配八进制转义值nml。 \un 匹配n，其中n是一个用四个十六进制数字表示的Unicode字符。例如，\u00A9匹配版权符号（©）。
修饰符
i:表示 不区分大小写 g:表示 全局匹配
change 事件
当元素内容发生了变化时触发
// change 事件 内容发生了变化
const input = document.querySelector('input')
input.addEventListener('change', function () {
console.log(111)
})
Node.contains()
返回的是一个布尔值，来表示传入的节点是否为该节点的后代节点
//如果queren有 icon-queren2 这个类就跳过，没有就阻止提交
if (queren.classList.contains('icon-queren2') === false) {
//queren.classList.contains('icon-queren2') 有 icon-queren2 这个类返回true，没有返回false
alert('请勾选同意协议')
// 阻止提交
e.preventDefault()
}
