本文参考自:慕课网 JavaScript正则表达式 http://www.imooc.com/learn/706 是自己看完视频后总结整理的笔记。
1.什么是正则表达式
Regular Expression使用单个字符串来描述、匹配一系列某个句法规则
的字符串---按照某种规则去匹配符合条件的字符串
正则表达式应用场景
1.在IDE中使用正则表达式处理规则复杂的字符串查找、替换需求
2.在JavaScript程序设计中使用正则表达式处理字符串
3.在其他语言中
**推荐一个可视化正则表达式网站:http://regexper.com**
2.Regexp对象
JavaScript通过内置对象RegExp支持正则表达式
有两种方法实例化RegExp对象:
2.1 字面量
var reg = /\bis\b/g;
var str = 'He is a boy.This is a dog. Where is she?';
console.info(str.replace(reg,'IS'));
2.2 构造函数
//这里和字面量定义不一样,因为js中\斜线是特殊字符,需要进行转义,
所以需要在\斜线前面加多一个\代表转义
var reg = new RegExp('\\bis\\b','g');
console.info('He is a boy. Is he?'.replace(/\bis\b/g,'IS'));
console.info('He is a boy. Is he?'.replace(/\bis\b/g,'IS'));
2.3 匹配模式:
g (global): 全文搜索,不添加g,搜索到第一个匹配停止;
i (ignore case) : 忽略大小写,不添加则默认为大小写敏感;
m ( multiple lines):多行搜索
3.元字符
正则表达式由两种基本字符类型组成
1.原义文本字符:代表它原来含义的字符 例如:abc、123
2.元字符:在正则表达式中有特殊意义的非字母字符 例如:
\b表示匹配单词边界,而非\b
在正则表达式中具体特殊含义的字符:* + ? $ ^ . \ () {} []
元字符:
\t:水平制表符;
\v:垂直制表符;
\n:换行符;
\r:回车符;
\0:空字符;
\f:换页符;
\cX:与X对应的控制字符(ctrl + x)
4.类
可以使用元字符[]来构建一个简单的类,所谓类是指符合某些特征的对象,一个泛指,而不是特指某个字符
4.1 字符类
一般情况下正则表达式一个字符对应字符串一个字符
表达式 ab\t 的含义是: 一个字母a一个字母b加一个水平制表符
console.info('a1b2c3d4'.replace(/[abc]/g,'X'));
console.info('xw中文123中文cv'.replace(/[\u4e00-\u9fa5]/g,'#'));
4.2 反向类
使用元字符 ^ 创建 反向类/负向类,反向类的意思是:不属于某类的内容
表达式 [^abc] 表示 不是字符a或b或c 的内容
'a1b2c3d4'.replace(/[^abc]/g,'字符');//"a字符b字符c字符字符字符"
4.3 范围类
正则表达式提供了范围类
使用字符类匹配数字 [0123456789]可以简写[0-9]
可以使用 [a-z] 来连接两个字符表示 从a到z的任意字符,闭区间,包含a和z本身,如:
'a1b2c3zx4z9'.replace(/[a-z]/g,'Q');
[0-9]表示0到9的值
[a-z]表示小写字母a到z
[a-zA-Z]表示小写和大写字母a到z
注意:a-z中间的-并不是代表字符哦 而是范围
如果要包括字符-的话,则加在后面,如[a-z-]
横线在之内是表示范围,之外是表示横线
4.4 预定义类
正则表达式预定义类:
.:出了回车符和换行符之外的所有字符,等价于[^\r\n]
\d:数字字符,等价于[0-9] digit
\D:非数字字符,等价于[^0-9]
\s:空白符,等价于[\t\n\x0B\f\r] space
\S:非空白符,等价于[^\t\b\x0B\f\r]
\w:单词字符(字母,数字,下划线),等价于[a-zA-Z_0-9] word
\W:菲单词字符,等价于[^a-zA-Z_0-9]
提示:大写的表示取反
例子:
匹配一个 ab+数字+任意字符 的字符串
使用范围类:ab[0-9][^\r\n] 使用预定义类:ab\d.
常见的边界匹配字符:
^ 以XXX开始
$ 以XXX结束
\b 单词边界
\B非单词边界
例子:
'@123@abc@'.replace(/^@./g,'Q');//Q23@abc@
'@123@abc@'.replace(/.@$/g,'Q');//@123@abQ
'@123@abc@'.replace(/.@/g,'Q');//@12QabQ
5. 量词
?出现0或1次(最多一次)
+出现1或多次(至少一次)
*出现0或多次(任意次)
{n}出现n次
{n,m}出现n到m次
{n,}至少出现n次
例子:
/\d{20}\w\d?\w+\d*\d{3}\w{3,5}\d{3,}/
正则中的量词。正则中的量词作用是紧挨着他的字符(如果没有使用分组的话);使用分组则会匹配分组。
6. 贪婪模式
贪婪模式 {3,5}尽量多的匹配5个,正则表达式在匹配时,尽可能多的匹配,直到匹配失败
非贪婪模式 {3,5}?尽可能少的匹配3个,正则表达式尽可能少的匹配,即一旦成功匹配就不再继续匹配
贪婪模式:JS正则表达式模式为贪婪模式,在数字常量后面加上?就可以使用非贪婪模式。
'123456789'.replace(/\d{3,5}/g,'A')
"AA"
'123456'.replace(/\d{3,5}/g,'A')
"A6"
7. 分组
1. 匹配字符串 Byron 连续出现 3 次的场景
使用()可以达到分组的功能,使量词作用于分组 (Byron){3},如果直接Byron{3}则匹配到的是Byronnn
例子:小写字母连续出现3次
'a1b2c3d4'.replace(/[a-z]\d{3}/g,'Q');
"a1b2c3d4"
'a1b2c3d4'.replace(/([a-z]\d){3}/g,'Q');
"Qd4"
分组引用
在分组的基础上,分组取值使用'$1 $2....'代表捕获分组内容
实现:
2015-12-25 => 12/25/2015
'2015-12-25'.replace(/(\d{4})-(\d{2})-(\d{2})/g,'$2/$3/$1');
"12/25/2015"
忽略分组
不希望捕获某些分组,只需要在分组内加上 ?:即可
'2015-07-09'.replace(/(?:\d{4})-(\d{2})-(\d{2})/g,'$2/$3/$1');
"09/$3/07"
2. 使用|将正则表达式分成前后两部分,可以达到 或 的效果
例子:
'ByronCasper'.replace(/Byron|Casper/g,'Q');
"QQ"
'ByrCasperByronsper'.replace(/Byr(on|Ca)sper/g,'Q');
"QQ"
8. 前瞻
正则表达式从文本头部向尾部开始解析,文本尾部方向,成为“前”
前瞻 就是在正则表达式匹配到规则的时候,向前检查是否符合断言。比如找到儿子为张三,还得看看他的父亲是否是李四
后顾/后瞻方向相反
注意:JavaScript不支持后顾
符合特定断言称为 肯定/正向 匹配
不符合特定断言称为 否定/负向 匹配
正向前瞻 exp(?=assert) 先判断是否符合正则,再符合正则的基础上判断是否符合断言
负向前瞻 exp(?!asseret)
正向后顾 exp(?<=assert) js不支持
负向后顾 exp(?<!assert) js不支持
例子:\w(?=\d) 正向前瞻 符合断言 匹配单词字符,要求首先是一个单词,并且这个单词符合断言,后跟一个数字
'a2*3'.replace(/\w(?=\d)/g,'A') "A2*3"
'a2*3bb'.replace(/\w(?=\d)/g,'A') "A2*3bb"
断言不参与规则部分,所以不会被替换
9. javascript regex对象
9.1 对象属性
global:是否全文搜索,默认false
ignoreCase:是否大小写敏感,默认是false
multiline:多行搜索,默认值是false
lastIndex:是当前表达式匹配内容的最后一个字符的下一个位置
source:正则表达式的文本字符串
9.2 regex对象方法
9.2.1. RegExp.prototype.test(str)
用于测试字符串参数中是否存在匹配正则表达式模式的字符串,如果存在则返回true,否则返回false
lastIndex 记录当前匹配结果的、最后一个字符的、下一个字符的位置
注意:test()方法在匹配的时候当匹配到一个结果时,会从lastIndex位置开始匹配下一个结果,直到不存在的时候才置为0。因此,当使用全局g属性标识时,当匹配到最后一个结果时,lastIndex值指向不存在的位置,此时再执行test()会返回false。
例子:多次执行test()方法,会在true、false之间循环
(/\w/g).test('a')每次执行都是正确的,但是通过实例化对象,需要很大的开销
test()方法:原意就是测试有没有、能不能匹配上,当使用test原意时,没必要加g
9.2.1. RegExp.prototype.exec(str)
使用正则表达式模式对字符串执行搜索,并将更新全局RegExp对象的属性一反映匹配结果
如果没有匹配的文本则返回 null,否则返回一个结果数组:
- index 声明匹配文本的第一个字符位置
- input 存放被检索的字符串 string
非全局调用
调用非全局的RegExp对象的 exec()时,返回数组
第一个元素是与正则表达式相匹配的文本
第二个元素是与RegExpObject的第一个子表达式相匹配的文本(如果有的话)
第三个元素是与RegExp对象的第二个子表达式相匹配的文本(如果有的话),以此类推
例子:
var reg3 = /\d(\w)(\w)\d/;
var reg4 = /\d(\w)(\w)\d/g;
var ts = '$1az2bb3cy4dd5ee';
var ret1 = reg3.exec(ts);
//0 1 1az2,a,z
console.log(reg3.lastIndex + '\t' + ret1.index + '\t' + ret1.toString());
var ret2 = null;
while (ret2 = reg4.exec(ts)) {
console.log(reg4.lastIndex + '\t' + ret2.index + '\t' + ret2.toString());
//5 1 1az2,a,z
//11 7 3cy4,c,y
}
9.3 String方法的正则表达式应用
9.3.1 String.prototype.search(reg)
用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串,方法返回第一个匹配结果的index,查找不到返回-1;
search()方法不执行全局匹配,它将忽略标志g,并且总是从字符串的开始进行检索。
例子:
'A11B2C3D4'.search(/\d/) //1
9.3.2 String.prototype.match(reg)
match()方法将检索字符串,以找到一个或多个与RegExp匹配的文本
RegExp是否具有标志 g 对结果影响跟大
非全局调用,即没有 g
如果RegExp没有标志 g,那么 match()方法就只能在字符串中执行一次匹配
如果没有找到任何匹配的文本,将返回null
否则它将返回一个数组,其中存放了与它找到的匹配文本有关的信息
返回数组的第一个元素存放的是匹配文本,而其余的元素存放的是与正则表达式的子表达式匹配的文本
除了常规的数组元素之外,返回的数组还含有2个对象属性
index 声明匹配文本的起始字符在字符串的位置
input 声明对 stringObject的引用
全局调用
如果RegExp具有标志 g,则match()方法将执行全局检索,找到字符串中的所有匹配子字符串
没有找到任何匹配的子串,则返回null
如果找到了一个或多个匹配的子串,则返回一个数组
数组元素中存放地字符串中所有的匹配子串,而且也没有index 属性或input属性
例子:
var reg3 = /\d(\w)\d/;
var reg4 = /\d(\w)\d/g;
var ts = '$1a2b3c4d5e';
var ret1 = ts.match(reg3);
console.info(ret1);//[ '1a2', 'a', index: 1, input: '$1a2b3c4d5e' ]
console.info(ret1.index + '\t' + reg3.lastIndex);//1 0
var ret2 = ts.match(reg4);
console.info(ret2);//[ '1a2', '3c4' ]
console.info(ret2.index + '\t' + reg4.lastIndex);//undefined 0
9.3.3 String.prototype.replace
replace方法比较强大,除了常规的 String.prototype.replace(str,replaceStr)和 String.prototype.replace(reg,replaceStr)之外,
还有String.prototype.replace(reg,function)
function参数含义
function会在每次匹配替换的时候调用,有四个参数
match:匹配字符串
group...:正则表达式分组内容,没有分组则没有该参数
index:匹配项在字符串中 index
origin:原字符串
例子:
console.info('a1b2c3d4e5'.replace(/\d/g, function(match, index, origin) {
//console.info(match);
console.info(index);
//console.info(origin);
return parseInt(match) + 1;
}));//a2b3c4d5e6
console.info('a1b2c3d4e5'.replace(/(\d)(\w)(\d)/g, function(match, group1, group2, group3, index, origin) {
console.info(match);
return group1 + group3;
})); //a12c34e5
9.3.4 String.prototype.split(reg)
我们经常使用split方法把字符串分割为字符数组
'a,b,c,d'.split(',');//[ 'a', 'b', 'c', 'd' ]
在一些复杂的分割情况下我们可以使用正则表达式解决
'a1b2c3d'.split(/\d/);//[ 'a', 'b', 'c', 'd' ]