揭秘正则表达式的基础语法与应用

正则表达式是强大的文本处理工具。从字符类到量词，再到分组与选择，本篇文章将带你深入了解正则表达式的基础语法和在实际场景中的广泛应用。无论你是初学者还是需要快速复习，本篇都将为你提供详尽而易于理解的指引。

一、正则表达式属性(修饰符)

修饰符用于执行不区分大小写和全局的搜索

1.【i】不区分大小写

var reg1 = /abc/
var reg2 = /abc/i
var str1 = 'ABC'
console.log(reg1.test(str1))//false
console.log(reg2.test(str1))//true

2.【g】全局匹配

var reg3 = /aa/
var reg4 = /aa/g
var str2 = "aabaaaab"
console.log(str2.match(reg3))//["aa"]
console.log(str2.match(reg4))//["aa","aa","aa"]

3.【m】执行多行匹配

var reg5 = /^ab/g
var reg6 = /^ab/gm
var str3 = "abcd\nabc"
console.log(str3.match(reg5))//["ab"]
console.log(str3.match(reg6))//["ab","ab"]

二、正则表达式模式

用于查找某个范围内的字符

1.【[]】

查找方括号之间的任何字符,一个方括号中写的是一个字符的取值范围

• 0-9表示所有数字;a-z表示所有小写字母;A-Z表示所有大写字母;A-z表示所有大小写字母
• 在[]中使用^{表示非的意思,例如/[}0-9]/也就是匹配非数字类型的内容

// 例如下面要获取三个数字的字符串
var reg7 = /[0-9][0-9][0-9]/g
var reg8 = /[^0-9][^0-9][^0-9]/g
var str4 = "121231ko23puu123"
console.log(str4.match(reg7))//["121","231","123"]
console.log(str4.match(reg8))//["puu"]

2.【()】

在括号中写入|表示或,也就是只要满足|前或者|后任意一个表达式即可

var reg9 = /(abc|bcd)/g
var str5 = "abcabbcd"
console.log(str5.match(reg9))//['abc', 'bcd']

三、正则表达式的元字符

是拥有特殊含义的字符,其实和表达式是一个东西

1.【\w】和【\W】

w意思是word，\w完全等于[A-z0-9]

W是非w，完全等于[^\w]

var reg10 = /\w\W/g
var str5 = "a;0,op"
console.log(str5.match(reg10))//['a;', '0,']

2.【\d】和【\D】

d代表0-9的数字,等同于[0-9]

D是非d,完全等于[^/d]和[^0-9]

var reg11 = /\d\D\D/g
var str6 = "1jj2lo990ol"
console.log(str6.match(reg11))//['1jj', '2lo', '0ol']

3.【\s】和【\S】

s代表空白字符,即空格和\t\n\r\v\f,等同于[\t\n\r\v\f ]

S是非s,完全等于[^/s]和[\t\n\r\v\f])

在正则表达式中写空格就代表空格

var reg12 = /\s/g
var str7 = "\n123\f123 1"
console.log(str7.match(reg12))//['\n', '\f', ' ']

4.【\b】和【\B】

b代表单词边界

B是非b,表示非单词边界,完全等于[^/b]

单词边界在字符串里面可以看成空格

var reg12 = /\b/g
var str8 = "1231231"
var str9 = "1231231 123kk"
var str10 = "1231231 123kk "
console.log(str8.match(reg12))//['', '']
console.log(str9.match(reg12))//['', '', '', '']
console.log(str10.match(reg12))//['', '', '', '']
var reg13 = /\bc/g
var str11 = "cth cujcc"
console.log(str11.match(reg13))//['c', 'c']

5.【\t】、【\n】、【\r】、【\b】、【\f】

/t:制表符；\n:换行符；\r:回车符；\v:垂直换行符；\f:换页符；

var reg14 = /ac\ts/g
var str12 = "ac\tsdf"
var str13 = "ac sdf"//这里的空是用tab符打出来的,但是系统是不能识别的,这几个都是如此
console.log(str12.match(reg14))//['ac\ts']
console.log(str13.match(reg14))//null

6.【\udddd】

这是四位的unicode编码(包含了汉字),且unciode也可以写成区间/[\u3000-\ua000]/

var reg15 = /\u4f60\u597d/ //这里是去找的你好的unicode编码,直接百度找在线转换即可
var str14 = "你好"//
console.log(str14.match(reg15))//['你好']

7.【.】

查找单个字符,除了换行和行结束符,也就是/.=[^\r\n]

var reg16 = /./g
var str15 = "你 很\n\t帅"
console.log(str15.match(reg16))//['你', ' ', '很', '\t', '帅']

四、正则表达式的量词(代表数量的词)

1.【n+】

匹配任何包含至少一个n的字符串。这个变量可以出现1到无数次

var reg17 = /\w+/g
var str16 = "abc"
var str17 = "abc\ndb"
console.log(str16.match(reg17))//['abc']
console.log(str17.match(reg17))//['abc', 'db']

2.【n*】

匹配任何包含零个或多个n的字符串。这个变量可以出现0到无数次

var reg18 = /\w*/g
var reg19 = /\d*/g
var str18 = "abc"
var str19 = "abcdb"
console.log(str18.match(reg18))//['abc', '']
console.log(str19.match(reg18))//['abcdb', ''] 光标在b后面,b后面有逻辑上的距离,*如果是零,匹配的是空,\w会先把能是被的值先识别,到最后识别不了了,才试一下*零,匹配空
console.log(str19.match(reg19))//['', '', '', '', '', ''] 光标在a前面,逻辑上有个距离,匹配了一个零,空串,然后光标移动到a后面,逻辑上又有距离,有宜配了一个零,空串,所以有多少个光标定位点就有多少个空串

3.【n?】

匹配任何包含零个或一个n的字符串。

var reg20 = /\w?/g
var str20 = "aaaaaaaaaa"
console.log(str20.match(reg20))//['a', 'a', 'a', 'a', 'a', 'a', 'a', 'a', 'a', 'a', '']

4.【n{X}】

匹配包含X个n的序列的字符串。

var reg21 = /\w{3}/g
var str21 = "aaaaaaaaaa"
console.log(str21.match(reg21))//['aaa', 'aaa', 'aaa']

5.【n{X,Y}】

匹配包含X至Y个n的序列的字符串。

var reg22 = /\w{3,5}/g
var str22 = "aaaaaaaaaaa"
console.log(str22.match(reg22))//['aaaaa', 'aaaaa']

6.【n{X,}】

匹配包含至少X个n的序列的字符串。

var reg23 = /\w{3,}/g
var str23 = "aaaaaaaaaaa"
console.log(str23.match(reg23))//['aaaaaaaaaaa']

7.【n$】

匹配任何以n结尾的字符串。

var reg24 = /[0-9]b$/g
var str24 = "0b9o34hb9b"
console.log(str24.match(reg24))//['9b']
// ^n 匹配任何以n开头的字符串。
var reg24 = /^[0-9]/g
var str24 = "00934h"
console.log(str24.match(reg24))//['0']

8.【?=n】

匹配任何其后紧接指定字符串n的字符串。正向预查

var reg25 = /a(?=b)/g
var str25 = "abaabaaaa"
console.log(str25.match(reg25))//['a', 'a']

9.【?!n】

匹配任何其后没有紧接指定字符串n的字符串。正向断言

var reg26 = /a(?!b)/g
var str26 = "abaabaaaa"
console.log(str26.match(reg26))//['a', 'a', 'a', 'a', 'a']

五、正则表达式的对象属性

1.【constructor】

返回创建 RegExp 对象原型的函数。

var reg27 = /[0-9]/
console.log(reg27.constructor)//RegExp()

2.【global】

检查是否设置了 "g" 修饰符。

var reg28 = /[0-9]/g
console.log(reg28.global)//true

3.【ignoreCase】

检查是否设置了 "i" 修饰符。

var reg29 = /[0-9]/i
console.log(reg29.ignoreCase)//true

4.【lastIndex】

规定开始下一个匹配的索引。

var reg30 = /[0-9]/i
console.log(reg30.lastIndex)//0.没匹配到返回0

5.【multiline】

检查是否设置了 "m" 修饰符。

var reg31 = /[0-9]/m
console.log(reg31.multiline)//true

6.【source】

返回 RegExp 模式的文本。

var reg32 = /[0-9]/i
console.log(reg32.source)//[0-9]

六、正则表达式的对象方法

1.【exec()】

测试字符串中的匹配项。会返回找到的值,并确定其位置

①从前往后找,先返回第一个找到的值,并返回其位置,第二次会返回第二个找到的值,依次类推,直到没有会返回null,再下一次就开始循环前面的步骤

②可以通过修改lastIndex来修改当前的位置,会从这个位置开始往下找,从而影响exec获取到的值是第几个

③如果不加g,lastIndex就不会动,永远返回的是第一个

var reg33 = /ab/g
var str27 = 'abababa'
console.log(reg33.exec(str27))//[0:'ab',index:0]
console.log(reg33.exec(str27))//[0:'ab',index:2]
console.log(reg33.exec(str27))//[0:'ab',index:4]
console.log(reg33.exec(str27))//null
console.log(reg33.exec(str27))//[0:'ab',index:0]
reg33.lastIndex = 4
console.log(reg33.exec(str27))//[0:'ab',index:4]
reg33.lastIndex = 3
console.log(reg33.exec(str27))//[0:'ab',index:4]

2.【test()】

测试字符串中的匹配项。返回 true 或 false。

var reg34 = /ab/
var str28 = 'abababa'
console.log(reg34.test(str28))//true

// toString():返回正则表达式的字符串值。
var reg35 = /ab/gi
console.log(reg35.toString())///ab/gi

七、正则表达式的拓展

【()】

这个括号还有一个子表达式的意思,正常来说括号写了没有用,也没影响,但是再特殊情况,当你把式子当特殊括起来以后,

这个括号会记录里面匹配的内容,记录完以后利用\几可以反向引用出来

var reg36 = /(\w)\1\1\1/g
var str29 = 'aaaabbbb'
console.log(str29.match(reg36))//['aaaa','bbbb']
var reg37 = /(\w)\1(\w)\2/g
var str30 = 'aabbccdd'
console.log(str30.match(reg37))//['aabb', 'ccdd']
console.log(reg37.exec(str30))//[0:'aabb',1:'a',2:'b',...] 使用exec会返回子表达式的内容,并且是正式的数据位,有下标的
var reg38 = /(\w)\1(\w)\2/
var str31 = 'aabbccdd'
console.log(str31.match(reg38))//[0:'aabb',1:'a',2:'b',...] 不用g匹配时,match也会返回子表达式的内容,并且是正式的数据位,有下标的

八、支持正则表达式的 String 对象的方法

1.【search】

检索与正则表达式相匹配的值。返回的不是-1则表示成功了,返回的时匹配的这个值所在的位置

var reg39 = /(\w)\1(\w)\2/g
var str32 = 'aabboojj'
var str33 = 'caabboojj'
var str34 = 'caaboj'
console.log(str32.search(reg39))//0
console.log(str33.search(reg39))//1
console.log(str34.search(reg39))//-1

2.【split】

把字符串分割为字符串数组。

var reg40 = /\d/g //使用数字分割
var str35 = 'aa8bb7cc9dd'
console.log(str35.split(reg40))//['aa', 'bb', 'cc', 'dd']
var reg41 = /(\d)/g //使用数字分割
var str36 = 'aa8bb8cc9dd'
console.log(str36.split(reg41))//['aa', '8', 'bb', '8', 'cc', '9', 'dd'] 如果使用了()子表达式,就会把子表达式的东西返回

3.【match】

找到一个或多个正则表达式的匹配。

var reg42 = /^[0-9]/g
var str37 = "00934h"
console.log(str37.match(reg42))//['0']

4.【replace】

替换与正则表达式匹配的子串。

var reg43 = /(\w)\1(\w)\2/g  //将aabb形式的内容换成bbaa
var str38 = "aabb"
console.log(str38.replace(reg43, "$2$2$1$1"))//bbaa. $1和$2分别代表第一个和第二个子表达式的内容,
console.log(str38.replace(reg43, function ($, $1, $2) { return $2 + $2 + $1 + $1 }))//bbaa. 也可以用函数,第一个参数是正则表达式匹配的全局,第二和第三个参数则是第一个和第二个子表达式的内容

九、补充

1.贪婪模式

正则表达式默认是贪婪匹配的,就是能匹配到的长度是越多越好的,可以通过在量词后面几个?将其变成非贪婪模式(能少就不多)

var reg44 = /a+/g
var reg45 = /a+?/g
var str39 = 'aaaa'
console.log(str39.match(reg44))//['aaaa']
console.log(str39.match(reg45))//['a', 'a', 'a', 'a']
//①??第一个问号是0-1的意思,加个问号就是能取0不取1.相当于第一个问好代表量词,第二个问号叫取消他的匹配
var reg46 = /a??/g
var str40 = 'aaaa'
console.log(str40.match(reg46))//['', '', '', '', '']
//②*?的意思是能取0就不多取
var reg47 = /a*?/g
var str41 = 'aaaa'
console.log(str41.match(reg47))//['', '', '', '', '']

2.获取一切的集合

用正则代表一切的集合可以使用好几种方式,例如/[\s\S]/ /[\d\D]/都可以