javascript正则表达式知识点全面梳理

这里写图片描述

一、使用方式

1、字面量模式

var reg = /is/g
全局匹配'is'

2、构造函数RegExp

var reg = new RegExp('is','g');

二者区别：

正则表达式字面量始终共享同一个RegExp实例，而使用RegExp每次创建一个新的实例，如下面的代码：

var re=null;

for(var i =0;i<4;i++){
    re = /cat/g;
    re.test('catabcdefg');
}
//true
//false
//true
//false
for(var i =0;i<4;i++){
    re = new RegExp('is','g');
    re.test('catabcdefg');
}
//true
//true
//true
//true

在第一个循环中，第一个调用test，查找到’cat’，下一次的匹配索引为上一次匹配的末尾，所有找不到，由于测试到了字符串的末尾，第三次调用test从头开始。

在第二个循环中，每次迭代都是重新创建了新的RegExp实例，因此每次都从头开始匹配。

二、RegExp实例属性

global – g
ignoreCase – i
lastIndex 搜索下一个匹配项的字符位置
multiline – m
source 正则表达式的字面量形式的字符串

三、元字符

以下为元字符：
* + ？ $ ^ . | \ ( ) { } [ ]

\t 水平制表符
\v 垂直制表符
\n 换行
\r 回车
\o 空字符
\f 换页符
\cX ctrl+X

四、字符类

使用[ ]构建一个类，匹配符合类特性的对象

如：[abc]把abc归为一类，匹配其中之一

'a1b2c3'.replace(/[abc]/g,'x');
//x1x2x3

五、范围类

在[ ]中使用’-‘创建范围类，如：

[a-z] 表示a~z小写的26个字母
[a-zA-Z] 表示大小写所有字母
[0-9] 表示0到9的10个数字

六、js预定义类及边界

1、预定义类

名称	解释	说明
.	[^\r\n]	除换行回车外的所有字符
\d	[0-9]	数字字符
\D	[^0-9]	非数字字符
\s		空白符
\S		非空白符
\w	[a-zA-Z_0-9]	单词字符，字母数字下划线
\W		非单词字符

2、边界

^ 以’xxx’开始使用时放在’xxx’前
$ 以’xxx’结束使用时放在’xxx’后
\b 字符边界
\B 非字符边界

七、量词

‘?’ 0或1次
‘+’ 1或多次
‘*’ 任意次
{n} n次
{n,m} n到m次
{n,} >=n次

八、贪婪模式与非贪婪模式

贪婪模式：尽可能多的匹配

非贪婪模式：尽可能少的匹配

'12345678'.replace(/\d{3,6}/g,'x')
//贪婪模式
//数字重复6次算作一次替换
//x78
'12345678'.replace(/\d{3,6}?/g,'x')
//非贪婪模式‘{3,6}?‘比贪婪模式多了一个'?'
//数字重复3次算作一次替换
//xx78

九、分组

使用()进行分组，如(abc){3}是对圆括号内元素重复三次。使用分组可以实现反向引用的效果，如下：

'2015-10-20'.replace(/(\d{4})-(\d{2})-(\d{2})/,'$2/$3/$1');
//   10/20/2015

忽略某一个分组：(?abc)

十、前瞻

js正则表达式支持前瞻不支持后顾，所谓前是指向着文本尾部方向，前瞻分为正向前瞻和负向前瞻

1、正向前瞻 exp(?=assert)

'a2*34vv'.replace(/\w(?=\d)/g,'x');
//表达式的含义：若一个单词字符后紧跟一个数字，则替换该单词字符
//x2*x4vv

上面的例子是在查找单词字符后紧跟数字的匹配项。

负向前瞻

'a2*34vv'.replace(/\w(?!\d)/g,'x');
//ax*3xxx

上面的例子是匹配单词字符后不是数字的字符。

十一、js对象方法

1、test() 根据查询匹配返回bool值

var re=null;

for(var i =0;i<4;i++){
    re = /cat/g;
    re.test('catabcdefg');
}
//true
//false
//true
//false

2、exec()

对字符串进行匹配，并更新属性，没有匹配到返回null，否则返回包含第一个匹配项的详细信息的数组，注意：每次只返回一个匹配项信息。详细信息包括index和input。

index是匹配项在字符串中的位置
input表示正则表达式字符串。

var msg = 'mom and dad and baby';
var pattern = /mom( and dad ( and baby)?)?/gi;

var matches = pattern.exec(msg);
alert(matches.index); //0
alert(matches.input); //'mom and dad and baby'
alert(matches[0]);    //'mom and dad and baby'
alert(matches[1]);    //'and dad and baby'
alert(matches[2]);    //'and baby'

虽然exec每次只返回一个匹配项，但是有两种模式的区别
- 非全局模式

多次调用，始终返回第一个匹配项信息

全局模式

多次调用，继续查找新的匹配项

十二、字符串对象方法

1、search()

返回查找结果的index，没有则返回-1
不执行全局，忽略g，总是从开头检索

2、match()

全局情况只返回匹配信息组成的数组，没有index、input信息

3、splite()

可使用正则表达式进行字符串拆分

'a1b2c3d4'.splite(/\d/g);
//['a','b','c','d']

replace()

替换，这个方法在前面的实例中已经介绍过了

十三、推荐工具

在这里推荐两个网站工具，可以很方便的进行正则表达式的测试和结果展现

1、正则测试工具

2、js测试工具

这里写图片描述