本文详细介绍了正则表达式的创建、使用方法，包括匹配、捕获等操作，并深入探讨了正则表达式的各种特性，如贪婪与非贪婪、限定符、元字符及分组等。
正则的创建：
<script>
// 正则表达式 RegExp (Regular Expression)规则表达式 是一个复杂数据类型
/* 作用：1.专门用来验证字符串是否符合规则
2.从字符串里面获取一部分符合规则的内容
语法：
使用一些特定的符合，来组合成一个表达式
使用这个表达式去验证字符串，或者从字符串里面获取一些内容
*/
</script>
<!-- <script>
// 创建一个正则表达式
// 1.字面量形式创建
var reg = /abcd/
// 2.内置构造函数创建
var res = new RegExp('abcd');
</script> -->
<!-- <script>
// 下面代码的意义：字符串中是否包含一段 abcd 字母
// aaabbbcccddd 就没有包含 不合格
// aaabcddd 有 合格
const reg = /abcd/
// /abcd/ 红字
console.log(reg)
// object类型
console.log(typeof reg)
const reg1 = new RegExp('abcd')
// /abcd/ 红字
console.log(reg1)
</script> -->
正则的两个方法：
<script>
/*
正则表达式的两个方法：
1.匹配：验证字符串是不是符合正则规则
语法：正则.test(要检验的字符串)
返回值：一个布尔值，true 或 false
2.捕获：从字符串里面获取符合正则规则的那一部分片段
语法：正则.exec(你要捕获的字符串)
返回值：
1.字符串里面没有符合规则的片段 null
2.字符串里有符合规则的片段
--》基础捕获 返回值是一个数组 索引0是捕获出来的片段
*/
</script>
<!-- <script>
// 1.匹配 正则.test()
// 表示字符串里面需要有一个abcd片段
const reg = /abcd/
// 结果是：false 因为在下面的字符串中没有检测到一段 abcd 的字符串
console.log(reg.test('aaabbbcccddd'))
// 结果是：false 因为在下面的字符串中有检测到一段 abcd 的字符串
console.log(reg.test('aaabcddd'))
</script> -->
<script>
// 2.捕获 正则.exec(要捕获的字符串)
const reg = /abcd/
// 字符串里面没有符合规则的片段 null
const res = reg.exec('aaabbbcccddd')
// 返回值是：null
// console.log(res)
// 字符串里有符合规则的片段 基础捕获 返回值是一个数组 索引0是捕获出来的片段
const res1 = reg.exec('aaabcdddabcd')
// 得到的结果是：0: "abcd" groups: undefined index: 2 input: "aaabcdddabcd" length: 1
// 上面的结果表示：0索引是捕获出来的片段你 index：2 表示从索引2开始捕获 input值表示的是要捕获的字符串的内容
// 我们发现不管有多少重复的片段只捕获第一段一样的字符段
console.log(res1)
</script>
正则的i，g：
<!-- <script>
/*
第一个是 规则 包含hello这个词
第二个参数是 修饰符i 忽略大小写 g是全局匹配
*/
var reg = new RegExp('hello','i')
//测试 参数字符串 是否匹配规则（满足规则）
var res = reg.test('Hello world')
// 因为定义的reg中有i不区分大小写，测试的字符串中有Hello，符合条件，
// 返回值是true
console.log(res)
</script> -->
<!-- <script>
// 字面量创建
// 表示定义的规则是包含hello，不区分大小写
var reg = /hello/i
// 测试的字符串中有Hello，符合规则，返回true
console.log(reg.test('aaHellobb'))
</script> -->
<!-- 没有g -->
<!-- <script>
// 属性
// var reg = /hello/gi;
var reg = /hello/i
// lastIndex 0 去匹配字符串的时候，从字符串的那个位置开始查找，
// 默认从字符串的开头位置，当不加g的时候,每次都是从0开始查找
// 第一个符合条件的位置
// 得到的是0
console.log(reg.lastIndex)
var str = 'aaaHellowordhelloaaa'
// 得到的是：true
console.log(reg.test(str))
// 得到的是0
console.log(reg.lastIndex)
// 得到的是：true
console.log(reg.test(str))
// 得到的是0
console.log(reg.lastIndex)
</script> -->
<!-- 有g -->
<!-- <script>
// 属性
var reg = /hello/gi;
// lastIndex 0 去匹配字符串的时候，从字符串的那个位置开始查找，
// 默认从字符串的开头位置，当加g的时候,每次都是从查找结束+1的
// 索引位置继续找下一个
// 得到的是0
console.log(reg.lastIndex)
var str = 'aaaHellowordhelloaaa'
// 得到的是：true
console.log(reg.test(str))
// 得到的是// 得到的是：true
console.log(reg.test(str))
// 得到的是17
console.log(reg.lastIndex)8
console.log(reg.lastIndex)
// 得到的是：true
console.log(reg.test(str))
// 得到的是17
console.log(reg.lastIndex)
// 后面没有了再次查找就是false
// 得到的是：false
console.log(reg.test(str))
// 得到的是0
console.log(reg.lastIndex)
</script> -->
正则的边界元字符：
<script>
/*
正则表达式的元字符 - 边界元字符
1.^ 表示字符串以什么开始
2.$ 表示字符串以什么结尾
*/
</script>
<!-- <script>
// 1.^
// 表示字符串需要以一个数字开头
const reg = /^\d/
// 得到的是:false
console.log(reg.test('scasc'))
// 得到的是:true
console.log(reg.test('1scasc'))
</script> -->
<!-- <script>
// 2.$
// 表示字符串需要以一个数字结尾
const reg = /\d$/
// 得到的是:true
console.log(reg.test('scasc1'))
// 得到的是:false
console.log(reg.test('1scasc'))
console.log(reg.test('sc1asc'))
</script> -->
<!-- <script>
// ^$放在一起使用
// 表示从开始到结尾只有一个数字
const reg = /^\d$/
// 得到的结果是:false
console.log(reg.test('11saca2'))
console.log(reg.test('11saca'))
console.log(reg.test('saca2'))
console.log(reg.test('saca'))
</script> -->
正则的限定符：
<!-- <script>
// a* a出现的次数0或多次
// true
// console.log(/^a*/.test('abc'))
// true
console.log(/^a*/.test('bc'))
</script> -->
<!-- <script>
// a+ a至少出现1次
// 开头是a，接着是b，并且b的次数至少出现1次
// true
console.log(/^ab+/.test('ab'))
// true
console.log(/^ab+/.test('abb'))
// false
console.log(/^ab+/.test('a'))
</script> -->
<!-- <script>
// a? a出现0次或者一次
// 开头是a接着是b，并且b出现一次或者零次，再接着是c
// true
console.log(/^ab?c/.test('abc'))
// true
console.log(/^ab?c/.test('ac'))
// fasle
console.log(/^ab?c/.test('abbc'))
</script> -->
<script>
// a{'a出现的次数'} a{'a至少出现的次数',}
// a{'a至少出现的次数'，'a最多出现的次数'}
// a开头，接着是b出现两次，接着是c
// true
// console.log(/^ab{2}c/.test('abbc'))
// false
// console.log(/^ab{2}c/.test('abc'))
// a开头，接着是b至少出现两次，接着是c
// false
// console.log(/^ab{2,}c/.test('abc'))
// true
// console.log(/^ab{2,}c/.test('abbc'))
// true
// console.log(/^ab{2,}c/.test('abbbc'))
// false
// console.log(/^ab{2,}c/.test('abcbbb'))
// a开头，接着是b至少出现2次，最多出现4次，接着是c
// false
// console.log(/^ab{2,4}c/.test('abc'))
// true
// console.log(/^ab{2,4}c/.test('abbc'))
// true
// console.log(/^ab{2,4}c/.test('abbbc'))
// true
// console.log(/^ab{2,4}c/.test('abbbbc'))
// false
// console.log(/^ab{2,4}c/.test('abbbbbc'))
</script>
<script>
// ^[a-zA-Z0-9] 表示是开头是a-z之间的小写字母A-Z的大写字母0-9的数字
// 开头是a或者b或者c
// true
// console.log(/^[abc]/.test('ascsv'))
// true
// console.log(/^[abc]/.test('bscsv'))
// true
// console.log(/^[abc]/.test('cscsv'))
// false
// console.log(/^[abc]/.test('dscsv'))
// 开头是a-z的小写字母
// true
// console.log(/^[a-z]/.test('ascsa'))
// true
// console.log(/^[a-z]/.test('dsbsescsa'))
// false
// console.log(/^[a-z]/.test('1dsbsescsa'))
// 开头是字母
// true
// console.log(/^[a-zA-Z]/.test('asasc'))
// true
// console.log(/^[a-zA-Z]/.test('Ssasc'))
// false
// console.log(/^[a-zA-Z]/.test('1sasc'))
// 开头是数字
// true
// console.log(/^[0-9]/.test('1sca'))
// true
// console.log(/^[0-9]/.test('8sca'))
// fasle
// console.log(/^[0-9]/.test('sca'))
// 开头是数字字母
// true
// console.log(/^[0-9a-zA-Z]/.test('avws'))
// true
// console.log(/^[0-9a-zA-Z]/.test('Savws'))
// true
// console.log(/^[0-9a-zA-Z]/.test('1Savws'))
// fasle
// console.log(/^[0-9a-zA-Z]/.test('%Savws'))
// 开头是非数字
// true
// console.log(/^[^0-9]/.test('ascsc'))
// false
// console.log(/^[^0-9]/.test('1scsc'))
// 开头是非数字字母
// false
// console.log(/^[^0-9a-zA-Z]/.test('asvas'))
// false
// console.log(/^[^0-9a-zA-Z]/.test('1svas'))
// false
// console.log(/^[^0-9a-zA-Z]/.test('Asvas'))
// true
// console.log(/^[^0-9a-zA-Z]/.test('%svas'))
</script>
正则的基础元字符：
<script>
/*
正则表达式的元字符--基础元字符
元字符：组成正则的基本符号
1.以符号的形式来代替文本内容
2.把所有的文本内容归结成一些符号来代替
*/
</script>
<!-- <script>
// 1. \s 表示一个空格
// 表示字符串里需要一个空格字符
const reg = /\s/ //等价于/ /
// 得到的结果是：false
console.log(reg.test('abcdefg'))
// 得到的结果都是：true
console.log(reg.test('abc defg'))
console.log(reg.test('abcdefg '))
console.log(reg.test(' abcdefg'))
</script> -->
<!-- <script>
// 2. \S 表示一个非空格
// 表示字符串里面需要一个 非空格 的字符
const reg = /\S/
// 得到的结果是：false
console.log(reg.test(' '))
// 得到的结果是：true
console.log(reg.test('abcd efg'))
</script> -->
<!-- <script>
// 3. \t 表示一个制表符tab 不是多个空格，是一个tab键
const reg = /\t/
// 这里打的是多个空格：false
console.log(reg.test('abcd efg'))
// 这里打的都是tab键：true
console.log(reg.test('abcd efg'))
console.log(reg.test(' abcdefg'))
console.log(reg.test('abcdefg '))
console.log(reg.test('abc defg '))
</script> -->
<!-- <script>
// 4.\d 表示字符串里面需要一个 数字（0-9） 字符
const reg = /\d/
// 得到的结果是：false
console.log(reg.test('abcdefg'))
// 得到的结果都是：true
console.log(reg.test('abscgf1'))
console.log(reg.test('1234567'))
</script> -->
<!-- <script>
// 5.\D 表示你的字符串里面需要一个 非数字 字符
const reg = /\D/
// 得到的结果是：false
console.log(reg.test('123456'))
// 得到的结果都是：true
console.log(reg.test('abcdefg'))
console.log(reg.test('ab1defg'))
console.log(reg.test('1abcdefg'))
console.log(reg.test('abcdefg1'))
</script> -->
<!-- <script>
// 6.\w 表示一个 数字字母下划线 都可以，只要有其中一个就可以
const reg = /\w/
// 只要里面有一个是 数字或者字母或者下划线 就是true ：得到的结果都是：true
console.log(reg.test('1 '))
console.log(reg.test('_ '))
console.log(reg.test('a '))
console.log(reg.test('1a_ '))
// 没有字母或数字或下划线得到的是false ，得到的结果都是：false
console.log(reg.test(' '))
console.log(reg.test('我是灰太狼'))
</script> -->
<!-- <script>
// 7.\W 表示一个 非数字、下划线、字母 只要有一个不是字母、数字、下划线就是true
const reg = /\W/
// 这些都是true
console.log(reg.test('a1_张'))
console.log(reg.test('张a'))
console.log(reg.test('张1'))
console.log(reg.test('张_'))
console.log(reg.test('_%'))
// 这个没有他们之外的字符，就是false
console.log(reg.test('acs123___'))
</script> -->
<!-- <script>
// 8. 点(.) 表示非换行的任意字符
// 表示字符串里需要有一个 非换行 的内容
const reg = /./
// 换行\n 是false
console.log(reg.test('\n'))
// 只要里面有一个不是换行就是true
console.log(reg.test('a\n'))
</script> -->
<script>
// 9. \ 表示转义符 表示把有意义的内容转换成没有意义的 把没有意义的转换成有意义的
// 表示字符串里需要有一个 非换行 的内容
const reg = /./
// 换行\n 是false
console.log(reg.test('\n'))
// 只要里面有一个不是换行就是true
console.log(reg.test('a\n'))
// 表示字符串里要有一个 . 文本
const reg1 = /\./
// 没有 . 文本就是flase
console.log(reg1.test('asdasc'))
// 有 就是true
console.log(reg1.test('asdasc.'))
// 表示字符串了需要一个 \ 文本 注意:要写两个\\,要不就会变成转义符使用
const reg2 = /\\/
// 得到的是false
console.log(reg2.test('sacasc'))
// 得到的是true
console.log(reg2.test('sac\\asc'))
</script>
正则的贪婪非贪婪：
<script>
/*
正则的贪婪和非贪婪
贪婪：当给一个符号使用限定符的时候，在补货的时候，他会尽可能多的去捕获内容
非贪婪：正则在捕获的时候尽可能的按照最小值来捕获，写限定符的时候，在后面多加一个?
*/
</script>
<!-- +? -->
<!-- <script>
// 有1个或多个数字
var reg = /\d+/
// 在捕获的过程中正则的贪婪会捕获尽可能多的数字
// 12344555
console.log(reg.exec('abc12344555ss2221'))
// 非贪婪 +?
var reg1 = /\d+?/
// 得到的是1
console.log(reg1.exec('abc12344555ss2221'))
</script> -->
<!-- *? -->
<!-- <script>
// 出现0次或多次
var reg = /\d*/
// 在捕获的过程中正则的贪婪会捕获尽可能多的数字
// 12344555
console.log(reg.exec('12344555ss2221'))
// 非贪婪 *?
// 捕获到0个
var reg1 = /\d*?/
// 得到的是空的
console.log(reg1.exec('12344555ss2221'))
</script> -->
<!-- ?? -->
<!-- <script>
// 出现0次或一次数字
var reg = /\d?/
// 在捕获的过程中正则的贪婪会捕获尽可能多的数字
// 1
console.log(reg.exec('12344555ss2221'))
// 非贪婪 ??
// 捕获0个
var reg1 = /\d??/
// 得到的是空的
console.log(reg1.exec('12344555ss2221'))
</script> -->
<!-- {n}? -->
<!-- <script>
// 出现2次数字
var reg = /\d{2}/
// 在捕获的过程中正则的贪婪会捕获尽可能多的数字
// 12
console.log(reg.exec('12344555ss2221'))
// 非贪婪 {n}?
// 捕获到2个
var reg1 = /\d{2}?/
// 得到的是12
console.log(reg1.exec('12344555ss2221'))
</script> -->
<!-- {n,}? -->
<!-- <script>
// 出现2次数字或多次
var reg = /\d{2,}/
// 在捕获的过程中正则的贪婪会捕获尽可能多的数字
// 12344555
console.log(reg.exec('12344555ss2221'))
// 非贪婪 {n,}?
// 捕获到2个
var reg1 = /\d{2}?/
// 得到的是12
console.log(reg1.exec('12344555ss2221'))
</script> -->
<!-- {n,m}? -->
<!-- <script>
// 出现2次数字或最多4次
var reg = /\d{2,4}/
// 在捕获的过程中正则的贪婪会捕获尽可能多的数字
// 1234
console.log(reg.exec('12344555ss2221'))
// 非贪婪 {n,m}?
// 捕获到2个
var reg1 = /\d{2}?/
// 得到的是12
console.log(reg1.exec('12344555ss2221'))
</script> -->
正则的分组：
<script>
var str = '2021-12-09'
var reg = /\d{4}-\d{2}-\d{2}/
// console.log(reg.test(str)) //true
//第一个捕获型分组 (\d{4})--》2021
// 第二个捕获型分组 (\d{2}) --》12
// 第三个捕获型分组 (\d{2})--》09
var reg2 = /(\d{4})-(\d{2})-(\d{2})/
console.log(reg2.test(str)) //true
//构造函数的 $1 属性 保存第一个分组 匹配到的内容 2021
//构造函数的 $2 属性 保存第二个分组 匹配到的内容 12
//构造函数的 $3 属性 保存第二个分组 匹配到的内容 09
// console.log(RegExp.$1)
// console.log(RegExp.$2)
// console.log(RegExp.$3)
// 非捕获型分组
// (?:\d{4}) 不会提取内容
// 第1个捕获型分组 (\d{2}) --》12
// 第2个捕获型分组 (\d{2})--》09
var reg3 = /(?:\d{4})-(\d{2})-(\d{2})/;
console.log(reg3.test(str)); //true
console.log(RegExp.$1); //12
console.log(RegExp.$2); //09
</script>
扫一扫
429
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
