头疼的正则表达式

正则表达式

对于正则表达式的学习，一直是比较头疼，但主要原因还是因为他的字符、规则偏多，所以对于我来说是因为懒惰吧，用心去总结，慢慢递进，还是可以改变这种状态的。

正则表达式(Regular Expression)其实就是一门工具，目的是为了字符串模式匹配，从而实现搜索和替换功能。从它的命名我们可以知道，它是一种用来描述规则的表达式。而它的底层原理也十分简单，就是使用状态机的思想进行模式匹配。大家可以利用regexper.com这个工具很好地可视化自己写的正则表达式:

从字符出发

先来了解一些常用的字符




了解具体的规则后，还是在例子中去总结吧：

1. 匹配有abc开头的字符串：

\babc或者^abc

2. 匹配8位数字的QQ号码：

^\d\d\d\d\d\d\d\d$

^\d{8}$

3. 匹配1开头11位数字的手机号码：

^1\d\d\d\d\d\d\d\d\d\d$

^1\d{10}$

4. 匹配银行卡号是14~18位的数字：

^\d{14,18}$

5. 匹配以a开头的，0个或多个b结尾的字符串

^ab*$

6. 如联通有130/131/132/155/156/185/186/145/176等号段

^(130|131|132|155|156|185|186|145|176)\d{8}$

((13[0-2])|(15[56])|(18[5-6])|145|176)\d{8}$

正则的方法

.test是可用于正则表达式的方法。它返回是否在字符串中找到正则表达式的布尔值：

let rat = /dog/;
rat.test('I saw a dog!');  // returns true
/rat/.test('I saw a dog!');  // returns true

特殊字符：
特殊字符是用于修改或指定正则表达式的字符组合的字符。最有用的特殊字符之一是方括号。方括号允许您表示目标字符串中的字符可以是任意数量的字符！让我们看看它们的作用：

const bt = /b[aeiou]t/;
bt.test('bat');  // returns true
bt.test('bet');  // returns true
bt.test('bit');  // returns true
bt.test('bot');  // returns true
bt.test('but');  // returns true
bt.test('bpt');  // returns false

想想看，括号里的一切都对应于你要搜索的字符串中的一个字符。在这个有用的能力之上，我们可以使用"-"字符来指定一个特定的字符范围!

const nums = /[0-5]/;
nums.test('0');  //  returns true
nums.test('3');  //  returns true
nums.test('7');  //  returns false

再者，比如，要指定所有的字母，你会做这样的事情:

const letters = /[A-Za-z]/;
letters.test('M');  // returns true
letters.test('y');  // returns true
letters.test('5');  // returns false

另一个需要记住的特殊字符是 "+"字符。这表明一个特定的元素可以重复1或者任何次数（不为0）。让我们看看它的作用。

const bomb = /boo+m/;  
bomb.test('boom!');  // returns true
bomb.test('Boom!');  // returns false
bomb.test('boooooooooooom!');  // returns true

如果你想忽略大小写怎么办，可以在后面加个i。

const bomb = /boo+m/i;  
bomb.test('boom!');  // returns true
bomb.test('Boom!');  // returns true
bomb.test('boooooooooooom!');  // returns true
bomb.test('BOOOOOOOOOOOOM!');  // returns true

比如我们常见的"？"字符也是一个有用的特殊字符。这个字符表示前面的字符可以包括也可以不包括。次数为0或者大于0

const color = /colou?r/; 
color.test('color');  // returns true
color.test('colour');  // returns true

你可能还需要关注的特殊字符是". “字符。这是个通配符。一个”. "可以代表任何其他字符，不包括换行。这个字符可以是多个，也可以是单个。

const anything = /./; 
anything.test('a');  // returns true
anything.test('1');  // returns true
anything.test('[');  // returns true
/._./.test('qqwwa_aassdddss')   // returns true

\w “字符指的是任何字母数字字符。它的反义词，”\W"，指任何非字母数字字符。

const alphaNumber = /\w/;  
alphaNumber.test('a');  // returns true
alphaNumber.test('1');  // returns true
alphaNumber.test('&');  // returns false
/\w/.test('1222sssaa')   // returns true

const notAlphaNumber = /\W/; 
notAlphaNumber.test('a');  // returns false
notAlphaNumber.test('1');  // returns false
notAlphaNumber.test('&');  // returns true

再介绍一个，"\s “字符指的是任何空白字符，而”\S "字符指的是任何非空白字符。

const whitespace = /\s/;  
whitespace.test('a');  // returns false
whitespace.test('1');  // returns false
whitespace.test('&');  // returns false
whitespace.test(' ');  // returns true
whitespace.test('\n');  // returns true
/\s/.test('     ssss')   // returns true

const notWhitespace = /\S/; 
notWhitespace.test('a');  // returns true
notWhitespace.test('1');  // returns true
notWhitespace.test('&');  // returns true
notWhitespace.test(' ');  // returns false
notWhitespace.test('\n');  // returns false

嗯，不能全部介绍完滴，还得自己查，那么有没有总结性的图呢，这个时候，当然有。

这是一个第三方网站，推荐结合这个，右边的语法参考.
https://c.runoob.com/front-end/854
最主要的就是下面这些啦。其实正则就是记！！！

• 校验数字的表达式
• 校验字符的表达式
• 特殊需求表达式

这些在有需要的时候可以自行通过以上网站查找。

RegExp – 常见四种正则方法

match()方法
match() 方法可在字符串内检索指定的值，这个校验方法有点类似于数组/字符串的indexOf()和lastIndexOf()方法，只不过这两个方法返回的是指定值首次出现的下标索引，而match()返回两种结果：

1.正常的校验指定字符，返回的则是一个不知道是数组，还是对象的字符数据，通过索引0可以获取返回的指定校验字符，但是可以通过.key的方式获取指定校验字符首次出现的下标索引和数据校验来源的原字符串

'adddddd'.match('ad')
["ad", index: 0, input: "adddddd", groups: undefined]

'adddddd'.match('d')
["d", index: 1, input: "adddddd", groups: undefined]

'adddddd'.match('12')
null

'123456'.match('5')
["5", index: 4, input: "123456", groups: undefined]

let ss = '123456'.match('4')

ss[0]
"4"
ss[1]
undefined
'1212121212'.match('12')
["12", index: 0, input: "1212121212", groups: undefined]

通过字符串检索查找，只会返回第一次查找到要查找元素

2.如果是通过正则方式校验，如果没有使用g修饰符，则跟字符串检索没有多大区别，如果使用了g修饰符，则返回的是字符串中出现的指定字符的所有值得数组集合，不会再有index和input等属性，纯粹是一个匹配结果值得数组集合

12345623123312'.match(/12/g)
(3) ["12", "12", "12"]

replace()方法
这个方法是用来匹配字符串里面指定要查找的字符串，并将匹配到的字符串替换成指定的字符串,也可以用replaceAll,我比较喜欢的一种方式。

'122222222'.replace('12', 'ouyang')
"ouyang2222222"

'12345661222333'.replace(/12/g, 'ouyang')
"ouyang34566ouyang22333"

'12345678909122'.replaceAll('12','ouyang')
"ouyang345678909ouyang2"

这个方法有两个参数，第一个参数可以是正则表达式，也可以是字符串，第二个参数就是匹配后替换的数据，或者生成替换文本的函数

exec()方法
用来校验传入的字符串中指定的匹配，返回一个数组，存放匹配的结果，如果没有匹配到，则返回null

返回数组的第零项元素是正则匹配到的值，第一项元素是正则表达式中第一个子表达式匹配的值，第二项元素是正则表达式中第二个兹表示匹配的值，以此类推，还会额外返回index和input属性

let str = 'abcdefgabcdefg'
let reg = /b/
let res = reg.exec(str)
console.log(res)

// 打印结果
['b', index: 1, input: "abcdefgabcdefg"]

如果是全局匹配，则可以通过循环语句，重复调用exec方法

let str = 'abcdefgabcdefg'
let reg = /b/g
let newRes
while ((newRes = reg.exec(str)) !== null) {
  console.log(newRes)
}

// 打印结果
["b", index: 1, input: "abcdefgabcdefg", groups: undefined]
["b", index: 8, input: "abcdefgabcdefg", groups: undefined]

为啥感觉跟matc那么像？没错！他们只是写法不一样。match是字符串.match,exec是正则.exec

'122233311222'.match('1')
["1", index: 0, input: "122233311222", groups: undefined]

/1/.exec('123331211111')
["1", index: 0, input: "123331211111", groups: undefined]

test()方法
test在上面已经列举啦。好啦，每天摸鱼的时候就多看看，多写写，多记记就可以啦。慢慢的就熟悉了，再也别想把我唬住了。。。