前言
正则可以在我们的日常工作中帮助我们处理一些字符匹配的逻辑，比如可以截取url后面的参数，或者校验一段字符串的正确性，可以用很少的代码做很多的事情，那这是我对正则的理解，确实在一定程度上可以节省很多代码，但是对于正则学习也确实需要一定的成本，本篇幅无论你是以后面试或者在实际场景中都可能用得到，细心读完肯定会有收货
介绍
正则表达式（英语：Regular Expression，在代码中常简写为regex、regexp或RE）使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。
上面这段理解来自百度百科，其实对于正则的学习也讲究方法和心得，一定要记住正则匹配要么是匹配字符要么是匹配位置，这句话要记在心里蛮重要的
开始
先说一下我们的目的
1.正则表达要了解其匹配原理
2.可以分析出别人的正则
3.针对不同的业务分析正则编写有思路不会懵逼
模糊匹配介绍
模糊匹配有两种方式
一种是要匹配的字符串长度可以是不固定长度使用量词{m,n}去实现
一种是匹配一组字符串其中的某一个字符，使用字符组的方式例如[lhc]，包含其中一个字符就可以通过
下面代码的解释大部分都放到了注释中哪里不理解可以评论区讨论
量词匹配
let str1 = 'lhhc'
let rgep1 = /lh{2}c/;//量词只写了一个值那么就按照这一个去匹配，只能是2个
console.log(rgep1.test(str1)) // true
let str2 = 'lhhc', str21 = 'lhhhc', str22 = 'lhhhhc';
let rgep2 = /lh{2,5}c/;//这个量词组代表匹配数量最少是2个最多是5个，在这个之间的字符都符合
console.log(rgep2.test(str2)) // true
console.log(rgep2.test(str21)) // true
console.log(rgep2.test(str22)) // true
字符组匹配
let str3 = 'yas ybs yds'
let str31 = 'ygs'
let rgep3 = /y[abd]s/g;//匹配的目标字符串，中间的值如果在此字符组里都可以通过
console.log(rgep3.test(str3)) // true
console.log(str3.match(rgep3)) // [ 'yas', 'ybs', 'yds' ]
console.log(rgep3.test(str31)) //false
字符组范围表示法
比如[123456abcdefABCDEF]这样太多了可以用-来表示改成这个样子[1-6az-fA-F]代表的是一个意思，我们看下面例子🌰
let str4 = '123 1b3 1C3';
let rgep4 = /1[1-6a-fA-F]3/g;
let rgep41 = /1[123456abcdefABCDEF]3/g;
console.log(rgep4.test(str4))//true
console.log(str4.match(rgep4))//[ '123', '1b3', '1C3' ]
console.log(rgep41.test(str4))//true
console.log(str4.match(rgep41))//[ '123', '1b3', '1C3' ]
如果你想单独匹配-，需要把-放在字符组前面或者后面或者转义例如下面这样子
let rgep5 = /[-az]/g, rgep51 = /[az-]/g, rgep52 = /[a\-z]/g;
字符组排除法
在字符组前面添加^[^45]表示当前字符位除了4,5都可以匹配
let str6 = '123 143 153', str61 = '143', str62 = '153';
let rgep6 = /1[^45]3/g;
console.log(str6.match(rgep6)) // ['123']
console.log(rgep6.test(str61)) // false
console.log(rgep6.test(str62)) // false
字符组简写模式
\d代表[0-9]，表示一位数字\D代表[^0-9]，表示当前这位非数字\w代表[0-9a-zA-Z_]，表示数字、小写字母、大写字母、下划线\W代表[^0-9a-zA-Z_]，和\w是相反的表示非数字、字母、下划线\s代表[\t\v\n\r\f]，表示空白字符包括空格、水平制表符、换行符、回车符等\S代表[^\t\v\n\r\f]]，和\s相反标识非空白字符.代表[^\n\r\u2028\u2029]，基本上表示任意字符了，除去换行符、回车符、行分隔符、段分隔符
如果要匹配任意字符可以使用[\d\D]、[\w\W]、[^]等其中的一个
量词简写模式
{m,}代表最少出现m次{m}代表出现m次?代表{0,1}，表示可以出现一次或者不出现+代表{1,}，表示最少出现一次，可以出现多次*代表{0,}，表示可以出现无数次，或者不出现
贪婪匹配和惰性匹配
贪婪匹配就是说在使用量词匹配的时候会尽量匹配多个比如{2,5}会以5为准尽量往多匹配，看下面🌰
let str7 = '123 1234 12345 123456';
let rgep7 = /\d{2,5}/g
console.log(str7.match(rgep7)) //[ '123', '1234', '12345', '12345' ]这里符合的全部匹配出来了
实现惰性匹配在后面加一个?，其实也比较好理解?可以是0次也可以是1次，看下面例子🌰
let str8 = '123 1234 12345 123456';
let rgep8 = /\d{2,5}?/g
console.log(str8.match(rgep8))
/**
* [
'12', '12', '34',
'12', '34', '12',
'34', '56'
]按照量词范围中最少的匹配
* */
实际案例
匹配16进制颜色，简单分析一下可以格式是
0-9和a-f还有A-F并且以#开头需要匹配3或6次，看代码
let str9 = '#ffbbad #Fc01DF #FFF #ffE'
let rgep9 = /#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})/g
console.log(str9.match(rgep9))//[ '#ffbbad', '#Fc01DF', '#FFF', '#ffE' ]
匹配24小时制时间，简单分析一下条件
1.第一位只能是0或1或2
2.第二位当第一位是1的时候可以是0-9，当第一位是2的时候只能是0-3
3.第三位只能是0到5
4.第四位只能是0到9
看下面的例子🌰
let str10 = '12:12 23:56 01:20 34:33';
let rgep10 = /([0-1][0-9]|2[0-3]):([0-5][0-9])/g
console.log(str10.match(rgep10))//[ '12:12', '23:56', '01:20' ]可以看到正确的都被正常匹配出来了
匹配日期格式
yyyy-mm-dd
let str11 = '2021-12-03 2022-12-31 1998-01-40';
let rgep11 = /\d{4}-(0[1-9]|1[0-2])-(3[01]|0[1-9]|[12][0-9])/g;
console.log(str11.match(rgep11))//[ '2021-12-03', '2022-12-31' ]
匹配某一字符比如下面的
html匹配出id="lhc"<div id="lhc"></div>
let str12 = '<div id="lhc" class="yls"></div>'
let rgep12 = /id="([^"]*)"/
console.log(str12.match(rgep12))
结语
对于正则的学习会分为几个篇幅单独整理，本篇幅主要是对正则基础的理解，其中主要囊括了对字符的匹配和常见的字符简写模式，包括对于量词的学习，这些基础必须要打牢，才能让我们对后面的正则学习更轻松
后面的几篇主要是对正则位置的匹配和正则回溯等操作的学习
祝福
新的一年马上就结束了2022年马上就来到了，希望看到这篇文章的人在新的一年里行大运，发大财，心想事成，财运亨通，顺顺利利，健健康康，最后新年快乐
