您的位置:首页 > Web前端 > JavaScript

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

2018-02-08 18:06 211 查看

一、使用方式

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()

4000

对字符串进行匹配,并更新属性,没有匹配到返回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测试工具

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息