PS:顺便推荐使用编辑器网站jsbin，还有正则图形化工具网站辅助学习regexper.com，当然使用谷歌浏览器console控制台也是可以的。

语法

使用单个字符串来描述,匹配一系列符合某个语法规则的字符串,简单来说就是按照某种规则去匹配符合条件的字符串.

例子

日期替换

    2003/03/03
    12345-30-40000
    
\d{4}[/-]\d{2}[/-]\d{2}
^\d{4}[/-]\d{2}[/-]\d{2}$
   ^(\d{4})[/-](\d{2})[/-](\d{2})$
/d 代表数字,{4}为4个,[-/]或者是/或者-
^表示开头,$表示结尾
()包裹分特定组,使用$1,$2进行替换

regexp对象

js通过内置对象RegExp支持正则表达式
通过两种方法实例化对象:字面量和构造函数

字面量

var reg = /\bis\b/g;
'his is  a  boy,hhah  is  hhhs'.replace(reg,'IS');
"his IS  a  boy,hhah  IS  hhhs"

构造函数

var  reg = new RegExp('\\bis\\b','g');
//两个\\代表对\转义
undefined
'his is  a  boy,hhah  is  hhhs'.replace(reg,'IS');
"his IS  a  boy,hhah  IS  hhhs"

修饰符

g:全局搜索,不添加,搜索到第一个匹配停止
i:忽略大小写,默认大小写敏感
m:multiple lines 多行搜索
lastIndex:是当前表达式匹配内容的最后一个字符的下一个位置
source:正则表达式的文本字符串

元字符

正则表达式由两种基本字符类型组成
原义文本字符:例如a就是表示a
元字符是在正则表达式中有特殊含义的非字母字符
例:*+?$^.|()[]{}

元字符[]类

'a1b2c3d4'.replace(/[abc]/g,'X')
"X1X2X3d4"

匹配[]里的泛指,匹配当中任意一个或是所有,只要符合[]就进行匹配

反向类^

意思是不包括^后面的内容

  'a1b2c3d4'.replace(/[^abc]/g,'X')
    "aXbXcXXX"

范围类

[0-9][a-z][A-Z]

'a1b2c3d4'.replace(/[a-z]/g,'X')
"X1X2X3X4"
'a1b2c3d4CDFDSFGRASDASDcsdfsdftgtgt'.replace(/[a-zA-Z]/g,'Q')
"Q1Q2Q3Q4QQQQQQQQQQQQQQQQQQQQQQQQQQ"
表示匹配所有符合a-zA-Z的字符

'2019-036-23'.replace(/[0-9-]/g,'X')
//0-9里面的-表示一个范围,第二个-表示匹配-
"XXXXXXXXXXX"

预定类

ab[0-9][^\r\n]
等价于
ab\d.

边界

2003-03-30

       ^(\d{4})[/-](\d{2})[/-](\d{2})$
^,$匹配开头和结尾

'@123@abc@'.replace(/@./g,'Q')
"Q23Qbc@"
匹配所有的后面有任意字符的@

'@123@abc@'.replace(/^@./g,'Q')
"Q23@abc@"
匹配只有开头并且后面有任意字符的@


'@123@abc@'.replace(/.@./g,'Q')
"@12Qbc@"
匹配前面有字符并且后面也有字符的@

'@123@abc@'.replace(/.@$/g,'Q')
"@123@abQ"
匹配前面有字符并且以@为结尾的@

mulsrt.replace(/^@\d/g,'X')
"X23
@345
@5667"
mulsrt.replace(/^@\d/gm,'X')
"X23
X45
X667"
匹配@开头@后面是数字,并且全局多行的@,替换成X

量词

贪婪模式(默认)

'12345678'.replace(/\d{3,6}/g,'X')
"X78"
尽可能多的匹配,所以这个上面就匹配6次,把6个字符替换成X

非贪婪模式?

尝试尽可能少的匹配,一旦匹配成功就不在进行匹配
量词后边加?

'12345678'.replace(/\d{3,6}?/g,'X')
"XX78"
非贪婪模式下尽可能少的匹配,每次匹配3个,所以替换两个X

分组()

'a1b2c3d4'.replace(/([a-z]\d){3}/g,'替代')
"替代d4"
为分组,匹配的就是([a-z]\d)整个字符,代表匹配前面是小写字符,后面是数字字符,符合这个条件的重复三次,取到a1b2c3这个字符串,如果不分组,{3}作用的就是\d这个数字字符,[a-z]\d{3}表示前面为小写字母字符,后面为重复三次的数字字符,如下面的例子

'a1b2c3d4c555'.replace(/[a-z]\d{3}/g,'替代');
"a1b2c3d4替代"

或

'ByronsperByrCasper'.replace(/Byr(on|Ca)sper/g,'X')
"XX"

正则匹配Byronsper或者是ByrCasper

反向引用

'2015-12-25'.replace(/(\d{4})-(\d{2})-(\d{2})/g,'$3//$2//$1')
"25//12//2015"

()分组,然后$1,$2,$3捕获

忽略分组

(?:Byron).(ok)
忽略byron的分组

前瞻

前瞻就是在正则表达式匹配到规则的时候,向前检查是否符合断言,后顾/瞻方向相反

javascript不支持后顾
符合和不符合特定断言成为肯定/正向匹配和否定/负向匹配

'a2*34v8vv'.replace(/\w(?=\d)/g,'X')
"X2*X4X8vv"
(?=\d)只是作为前瞻断言,判断是否符合条件,不参与匹配置换
这个正则的意思是匹配前面是单词字符,后面是数字
'a2*34v8vv'.replace(/\w(?!\d)/g,'X')
"aX*3XvXXX"
意思是匹配前面是单词字符,前面是数字
这个正则的意思是前面是单词,后面不是数字

RegExp.prototype.test(str)

用于测试字符串参数中是否存在匹配正则表达式模式的字符串

如果匹配返回true,不匹配返回false

RegExp.prototype.exec(str)

使用正则表达式模式对字符串执行搜索,并将更新全局RegExp对象的属性以反应匹配结果
如果没有匹配的文本则返回null,否则返回一个结果数组

• index 声明匹配文本的第一个字符的位置

• input 存放被检索的字符串string

  非全局调用

  返回数组,
  第一个元素是与正则表达式相匹配的文本
  第二个元素是与RegExpObject的第一个子表达式相匹配的文本
  第三个元素是与RegExp对象的第二个子表达式相匹配的文本

例子:

var reg1 = /\d(\w)(\w)\d/;
var reg2 = /\d(\w)(\w)\d/g;
var str = '$1az2bb3cy4df5ff';

var ret= reg1.exec(str);

console.log(reg1.lastIndex + '\t' + ret.index+ '\t' +ret.toString());

console.log(reg1.lastIndex + '\t' + ret.index+ '\t' +ret.toString());

输出

"0  1 1az2,a,z"
"0  1 1az2,a,z"

第一个0代表是lastIndex,因为不是全局调用,所以lastIndex不起作用
第二个是index,代表匹配文本的第一个字符位置,第一个匹配文本是1az2,1的位置为1
第三个是输出匹配文本的字符串形式,第一个匹配文本是1az2,然后因为exec函数返回一个数组,第二个元素就是子表达式相匹配的文本,在这个正则上子表达式就是分组(\w),然后第二第三元素相匹配的就是a和z

全局调用

var reg1 = /\d(\w)(\w)\d/;
var reg2 = /\d(\w)(\w)\d/g;
var str = '$1az2bb3cy4df5ff';



while(ret= reg2.exec(str)){
console.log(reg2.lastIndex + '\t' + ret.index+ '\t' +ret.toString()  +'\t');
}

输出

"5  1 1az2,a,z  "
"11 7 3cy4,c,y  "

全局输出,因为是全局输出,所以正则匹配所有符合条件的文本,第一行数据lastIndex输出匹配元素的最后一个字符的下一个位置,这个第一个匹配文本为1az2,下一个位置为5,第二第三元素匹配分组(\w),输出a,z
第二行数据匹配文本为3cy4,下一个位置为11,匹配文本的第一个字符位置为7.

因为是while语句,在之后没有符合条件的文本,所以停止不在输出.

Stringl.protatype.search(reg)

search方法用于检索字符换中指定的子字符串,或检索与正则表达式相匹配的子字符串
方法返回第一个匹配结果index,查找不到就返回-1
search方法不执行全局匹配,忽略g.总是从字符串的开始进行检索

Stringl.protatype.match(reg)

检索字符串,找到一个或是多个与regexp匹配的文本
regexp是否具有g对结果影响很大
非全局调用下返回数组,数组的第一个元素存放的是匹配文本,其余元素存放的是与正则表达式的子表达式匹配的的文本,除了数组元素,还包含两个对象属性
index声明匹配文本的起始字符在字符串中的位置
input生命对stringObject的引用
和exec相像

非全局

var reg1 = /\d(\w)(\w)\d/;
var reg2 = /\d(\w)(\w)\d/g;
var str = '$1az2bb3cy4df5ff';

var ret= str.match(reg1);
console.log(ret);
console.log(ret.index + '\t' + reg1.lastIndex)

输出

["1az2", "a", "z"]
"1  0"

1az2是输出的匹配文本，a、z输出的是子表达式匹配的文本，这的子表达式就是（）分组
1是匹配的第一个文本的起始字符的位置为1
0，非全局lastIndex不起作用，为0

全局

var reg1 = /\d(\w)(\w)\d/;
var reg2 = /\d(\w)(\w)\d/g;
var str = '$1az2bb3cy4df5ff';

var ret= str.match(reg2);
console.log(ret);
console.log(ret.index + '\t' + reg2.lastIndex)

输出

["1az2", "3cy4"]
"undefined  0"

输出了所有匹配的字符串,相比exec来说没有index和lastIndex,但是输出所有匹配字符串很方便,不用想exe自己定义while方法

Stringl.protatype.sqlit(reg)

经常使用split方法把字符串分割为字符数组

 'a,b,c,d'.split(',')
["a", "b", "c", "d"] 

在一些复杂的分割情况下可以使用正则表达式

'a1b2c3d'.split(/\d/);
["a", "b", "c", "d"]

Stringl.protatype.replace(reg)

'a1b'.replace('1',2)
"a2b"
'a1b1c2d111'.replace('1',2)
"a2b1c2d111"
'a1b1c2d111'.replace(/1/g,2)
"a2b2c2d222"
把所有1替换成2