前言

本文整理了正则表达式相关知识点总结，如果对答案有不一样见解的同学欢迎评论区补充讨论，当然有问题，也欢迎在评论区指出。

一、简洁语法：

let expression = /pattern/flags ;    
// pattern 匹配模式    flags标记

二、标记flags

g（全局模式）：查找字符串的全部内容
i（不区分大小写）
m（多行模式）：查找到一行末尾会继续下一行查找
^ ：字符串开头
$ ：字符串结尾

三、元字符

*, +, ?, $, ^, ., |, , (, ), {, }, [, ]   //转义

四、预定义类及边界

（大写字母都是“非”）

字符	等价类	含义
.	[^ \r \n]	除了回车符和换行符之外的所有字符
\d	[0-9]	数字字符
\s	[\t \n \x 0 B\ f \r]	空白符
\w	[a-z A-Z _ 0-9]	单词字符（字母、数字、下划线）
\b	ab，dsab	单词边界bound

五、字符类

表达式'[abc]'把字符a或b或c归为一类
字符类取反'[^abc]'

六、范围类

[a-zA-Z]  大小写字母
[0-5]    0到5

七、量词

字符	含义
？	出现零次或一次（最多出现一次）
+	出现一次或者多次（至少出现一次）
*	出现零次或者多次（任意次）
{n}	出现n次
{n,m}	出现n到m次
{n,}	至少出现n次

var reg = /\d{4}[/-]\d{2}[/-]\d{2}/g;
var text = '2018-02-23，2018/02/24，2018~02/25';
var result = text.replace(reg,'匹配正确日期格式');
console.log(result);//匹配正确日期格式，匹配正确日期格式，2018~02/25

八、贪婪模式

let str = 'Hello World  el'
let regExp = /el{1,2}/g  //尽可能匹配多的字符
console.log(str.match(regExp)) //[ 'ell', 'el' ]

九、分组

let str = 'Hello World  elel'
let regExp = /el{2}/g  //只重复l
let regExp1 = /(el){2}/g  //重复()里的
console.log(str.match(regExp)) //[ 'ell' ]
console.log(str.match(regExp1)) //[ 'elel' ]

1、或 []、|

'[]'字符类（字符集合）可能只能匹配单个字符的或者关系，比如匹配a或b，你可以这样写：'[ab]'

let regExp = /[abc]/  //匹配a或b或c，匹配单个字符
let regExp = /(ll|or)/g  //匹配ll或or，匹配多个字符

2、引用（）

() 表示捕获分组，() 会把每个分组里的匹配的值保存起来，匹配的值可以用 $1表示第一次匹配成功，$ 3表示第三次匹配成功的字符，以此类推至$99）

//日期'2015-12-25'替换成'12/25/2015'
let date = '2015-12-25'
let regExp = /(\d{4})-(\d{2})-(\d{2})/g
console.log(date.replace(regExp,'$1/$2/$3'))

//重点
\1是引用第一个匹配到的字符串
const str ='hello world';
const reg = /([a-zA-Z])\1/;
console.log(str.match(reg))
//[ 'll', 'l', index: 2, input: 'hello world', groups: undefined ]
//可以用来测试字符串中是否连续相同的字符
console.log(reg.test(str)) //true

3、非捕获元 ?:、?=、?<=、?!、?<!区别

?: ---- 用圆括号()会有一个副作用，使匹配到的字符串被缓存，此时可用 ?: 放在你想消除匹配的括号里，就不会占用$1。

var reg = /(?:Byron)(\d{4})-(\d{2})-(\d{2})/g;
var text = 'Byron2016-12-05'
var result = text.replace(reg,'$2/$3/$1');
console.log(result);//12/05/2016

?= ----- 正向预查，在任何开始匹配圆括号内的正则表达式模式的位置来匹配搜索字符串

exp1(?=exp2)：查找 exp2 前面的 exp1。
'1234hzy123hzy341hzy'.replace(/hzy(?=\d+)/g,function (item){
    console.log(item) // hzy  hzy 匹配至少一个数字前面的 hzy
})

高阶---千位符
'1234567890'.replace(/\d{1,3}(?=(\d{3})+$)/g, function (item){
    console.log(item)  //  1  234  567
});

?! ----- 负向预查，在任何开始不匹配该正则表达式模式的位置来匹配搜索字符串

(?<=exp2)exp1：查找 exp2 后面的 exp1

exp1(?!exp2)：查找后面不是 exp2 的 exp1

(?<!exp2)exp1：查找前面不是 exp2 的 exp1

十、在JavaScript中的应用

new RegExp() 动态生成正则表达式

let key = 'name'
const reg = new RegExp("([^|&])"+ key + "([^&]+)(&|$)", "g")

1、正则表达式RegExp对象本身的方法

reg.test() 只能测试是否包含，返回一个bool变量。
reg.exec() 可以实现匹配全局，并返回分组的结果
reg.compile()

let str = 'Hello World'
let regExp = /o/g

console.log(regExp.test(str)) // true
console.log(regExp.exec(str)) //[ 'o', index: 4, input: 'Hello World', groups: undefined ]
console.log(regExp.exec(str)) //[ 'o', index: 7, input: 'Hello World', groups: undefined ]
console.log(regExp.exec(str)) //null

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

str.match() 与test()不同，会返回你所匹配到的内容。以数组返回
str.split() 将字符串按照某个字符分隔开，返回一个数组
str.replace() str.replace(reg,replace|function)，第一个参数是正则表达式，代表匹配的内容，第二个参数是替换的字符串或者一个回调函数
- 注意：第二个参数必须是字符串; 注意不要忘记加g
str.search() 返回第一个匹配字符串的索引

let str = 'Hello World'
let regExp = /o/g

console.log(str.match(regExp)) //['o','o']
//替换一个序列中的元音字母(aeiou)，将其替换成一个double。 比如a->aa
console.log(str.replace(/([aeiou])/g,"$1$1"))  //Heelloo Woorld
console.log(str.search(regExp))   // 4  返回第一个匹配字符串的索引

3、reg.exec(str)和str.match(reg)区别

全局匹配的情况，有'g'，两者不同
let str = 'waddsadds'
let temp = 'add'
let reg = new RegExp(temp,'g');
console.log(reg.exec(str),str.match(reg))
// [ 'add', index: 1, input: 'waddsadds', groups: undefined ]    [ 'add', 'add' ]

不全局匹配情况，无'g' ，两者相同
let str = 'waddsads'
let temp = 'add'
let reg = new RegExp(temp);
console.log(reg.exec(str),str.match(reg))
[ 'add', index: 1, input: 'waddsads', groups: undefined ]   [ 'add', index: 1, input: 'waddsads', groups: undefined ]

IP地址

let str = '226.1.255.25'   //0~255.255.255.255   0~9,10~99,100~199
let regExp = /^((25[0-5]|2[0-4]\d|1\d{2}|[1-9]\d|\d).){3}(25[0-5]|2[0-4]\d|1\d{2}|[1-9]\d|\d)$/
console.log(str.match(regExp))

总结

觉得写得好的，对你有帮助的，可以分享给身边人，知识越分享越多，千万不要吝啬呀

后续更新前端其它知识点总结，请关注我，整理好，分享给你们，我们一起学前端

正则表达式（RegExp）

前言