** 题记:接上回,我们说到了关于正则表达式的基本的语法,这次我们就来继续拓展正则表达式的内容,包括了正则表达式中的JS对象属性以及常用的text和exec方法等等一系列内容。接下来,show time!!!(控制不住寄己啊)**
No.1前瞻
题外话:说到前瞻,大家是不是想到成语前瞻后顾了呢?笔者认为两者还是有一定联系的!瞻:向前看;顾:回头看。看看前面,又看看后面。形容做事之前考虑周密慎重。也形容顾虑太多,犹豫不决。亦作“瞻前顾后”。
</br>
回归正题,正则表达式的解析规则:文本头部向尾部开始解析,文本尾部方向,称为"前"。
前瞻就是在正则表达式匹配到规则的时候,还需要向前检查是否符合断言,后顾/后瞻方向相反。但是JavaScript不支持后顾,符合和不符合特定断言称为 肯定/正向 匹配和 否定/负向 匹配
前瞻:
名称 | 正则 | 含义 |
---|---|---|
正向前瞻 | exp(?=assert) | |
负向前瞻 | exp(?!assert) | |
正向后顾 | exp(?<=assert) | JavaScript不支持 |
负向后顾 | exp(?<!assert) | JavaScript不支持 |
代码测试:
- 测试1
var a = 'a2*w3_e3'.replace(/\w(?=\d)/g,'X');
console.log(a);
先检查是否是单词字符,如果是,则继续向后检查是否是数字字符的断言部分,如果符合就将单词字符替换成 'X';这里只把前面的单词字符替换成 'X',后面的数字并不替换。但断言部分也属于判断的条件。
- 测试2
var a = 'a2*w3_33'.replace(/\w(?!\d)/g,'X');
console.log(a);
匹配是单词字符,并且单词字符后面不是数字的字符的规则!将单词字符替换成 'X'。
No.2 对象属性
- global:是否全文搜索,默认为false
- ignore case:是否大小写敏感,默认为false
- multiline:多行搜索,默认为false
- lastIndex:是当前表达式匹配内容的最后一个字符的下一个位置
- source:正则表达式的文本字符串
代码测试
var reg1 = /\d/;
var reg2 = /\d/gim;
console.log(reg1.global,reg1.ignoreCase ,reg1.multiline,reg1.source);
console.log(reg2.global,reg2.ignoreCase ,reg2.multiline,reg2.source);
设置了 g , i , m之后的值为true,source也就是正则表达式里的内容!
注意:g、i、m三者都是只读属性,不能通过 reg1.global = true 来设置,这样是无效的!
No.3 test方法
RegExp.prototype.test(str)
意义: 用于测试字符串中的数字是否存在匹配正则表达式模式的字符串
返回值:如果存在就返回true,否则返回false
- 测试1
var reg1 = /\d/;
console.log(reg1.test('a'));
console.log(reg1.test("2"));
匹配字符 a 时返回false,匹配数字 2 时返回true。没错!
- 测试2
var reg2 = /\d/;
console.log(reg2.test("2"));
console.log(reg2.test("2"));
console.log(reg2.test("2"));
console.log(reg2.test("2"));
连续打印了四次true,这在我们的意料之中!
- 测试3
var reg3 = /\d/g;
console.log(reg3.test("2"));
console.log(reg3.test("2"));
console.log(reg3.test("2"));
console.log(reg3.test("2"));
什么情况?What happen?!这不科学啊!为啥这里出现了false了?难道不应该和上面的结果一样的吗?其实不然!这个就是因为定义了全局匹配,并且这个锅由lastIndex来背。
我们可以这样改下代码!
var reg4 = /\d/g;
while(reg4.test("12")){
console.log(reg4.lastIndex);
}
第一次reg4的 lastIndex 的结果为 ‘1’,第二次的值为 ‘2’;上边我们有说到lastIndex就是当前表达式匹配内容的最后一个字符的下一个位置。所以就不难理解为什么会打印出 1 和 2 了,这也就解释了之前为什么打印出true、false、true、false了。执行到第二次的时候,lastIndex的值为1,打印出false;执行到第三次的时候就重置lastIndex为0了,所以打印出true!但是,我们用test的本意就是想查看字符串中是否存在符合正则表达式规则的内容,所以不必使用全局变量g!
No.4 exec方法
RegExp.prototype.exec(str)
意义:使用正则表达式模式对字符串执行搜索,并将更新全局RegExp对象的属性以反映匹配的结果!(这里的属性主要指的就是lastIndex属性)
返回值:如果没有匹配的文本就返回null,否则返回一个结果数组:
- index:声明匹配文本的第一个字符的位置
- input :存放被检索的字符串 string
No.4.1 非全局调用
- 调用非全局的 RegExp 对象的 exec() 时,返回数组
- 第一个元素是与正则表达式相匹配的文本
- 第二个元素是与 RegExpObject 的第一个子表达式相匹配的文本(如果有的话,也就是分组的文本)
- 第三个元素是与 RegExpObject 的第二个子表达式相匹配的文本(如果有的话,也就是分组的文本),以此类推。。。
代码测试:
var reg5 = /\d(\w)\d/;
var str = '1q2w3e4r5t';
var ret = reg5.exec(str);
console.log(reg5.lastIndex + '\t' + ret.index + '\t' + ret.toString());
从打印结果我们可以看出reg5的lastIndex之为‘0’,但实际上我们知道lastIndex的值实际上不应该为0,这也就变相的说明了,在非全局调用(g)中,reg5的lastIndex属性根本不生效!而第二个ret.index指的就是符合正则表达式的字符串在原字符串中的开始下标;第三个ret.toString就是上面所说返回的数组,"1q2"代表与正则表达式相匹配的文本内容,"q"代表的就是分组的文本内容。
No.4.2 全局调用
话不多说,直接上代码看不同!
var reg6 = /\d(\w)(\w)\d/g;
var str = '1qw2wd3ef4rg5th';
while (ret = reg6.exec(str)) {
console.log(reg6.lastIndex + '\t' + ret.index + '\t' + ret.toString());
}
这里可以看出lastIndex为4,就是匹配完1qw2后;index为0就是数字1的下标了,里面的分组内容就是q和w了
No.5 search方法
** String.prototype.search(reg)**
意义:search()方法用于检索字符串中指定的字符串,或检索与正则表达式相匹配的子字符串
返回值:方法返回第一个匹配结果的index,查找不到返回-1。
search方法不执行全局匹配,它将忽略标志 g,并且总是从字符串的开始进行检索!
代码测试:
var str = "b45h65j8k9";
console.log(str.search('5'));
console.log(str.search('10'));
这里直接返回5所在的下标2;未找到10就返回-1,这是相当的简单!
No.5 match方法
** String.prototype.match(reg)**
意义:match()方法将检索字符串,以找到一个或多个与regexp匹配的文本。
RegExp是否具有标志 g对结果影响很大。
No.5.1 非全局调用
- 如果没有标志 g ,那么 match()方法就只能在字符串中执行一次匹配。
- 如果没有找到任何匹配的文本,将返回 Null。
- 否则它将返回一个数组,其中存放了与它找到的匹配文本有关的信息。
- 返回数组的第一个元素存放的是匹配的文本,而其余的元素存放的是与正则表达式的子元素匹配的文本。
- 除了常规的数组元素之外,返回的数组还含有 2个对象属性
- index 声明匹配文本的起始字符在字符串的位置
- input 声明对 stringObject 的引用。
var reg5 = /\d(\w)\d/;
var str = '1q2w3e4r5th';
var ret = str.match(reg5);
console.log(ret);
console.log(reg5.lastIndex + '\t' + ret.index);
返回的结果就是匹配到的内容1q2和分组的内容q。因为不是全局匹配,所以lastIndex没用,这里的index就是0。
No.5.2 全局调用
- 如果RegExp具有标志 g 则 match()方法将执行全局检索,找到字符串中所有的匹配子字符串
- 没有找到任何匹配的子串,则返回null
- 如果找到了一个或多个匹配子串,则返回一个数组
- 数组元素中存放的是字符串中的所有的匹配子串,而且也没有index属性或input属性。
var reg6 = /\d(\w)\d/g;
var str = '1q2w3e4r5th';
var ret = str.match(reg6);
console.log(ret);
console.log(reg6.lastIndex + '\t' + ret.index);
返回值就是两个符合匹配规则的内容 1q2和3e4,这里也并没有返回分组信息和lastIndex、index的信息了。
No.6 split方法
** String.prototype.split(reg) **
- 我们经常使用 split 方法把字符串分割为字符数组
** "a,b,c,d".split(','); // ["a","b","c","d"]** - 在一些复杂的分割情况下我们可以使用正则表达式解决
** "a1b2c3d".split(/\d/); // ["a","b","c","d"]**
No.6 replace方法
** String.prototype.replace(reg) **
有三种用法:
- String.prototype.replace(str,replaceStr)
- String.prototype.replace(reg,replaceStr)
- String.prototype.replace(reg,function)
这里第二个replace只替换了字符串的第一个数字 “1”,隐式地转换成"a1b1c3".replace('/1/',2),这样我们应该也能想到这个就涉及到了全局变量的替换问题了!
我们这样写就没问题了!
function参数的含义
function会在每次匹配替换的时候调用,有4个参数
- 匹配字符串
- 正则表达式分配的内容,没有分组则没有该参数
- 匹配项在字符串中的index
- 原字符串
例子1:
我们可以利用function来完成一些复杂的功能;利用function我们能将a1b2c3d4e5字符串中的数字部分分别加1,变成a2b3c4d5e6。
var ret = 'a1b2c3d4e5'.replace(/\d/g,function(match,index,origin){
console.log(index);
return parseInt(match) + 1;
});
console.log(ret);
例子2:
我们能将a1b2c3d4e5字符串中的数字中间的字母去掉,变成a12c34e5
var ret = 'a1b2c3d4e5'.replace(/(\d)(\w)(\d)/g,function(match,group1,group2,group3,index,origin){
console.log(index);
return group1 + group3;
});
console.log(ret);
正则表达式终结者:关于正则表达式中笔者了解的所有的内容全都如数奉上了,尽情享用!如有裨补缺漏,望各位积极补刀!如果能助您一臂之力,实乃在下荣幸!(书写完毕,感觉身体被掏空/(ㄒoㄒ)/~~点一首《冬天的秘密》送给各位,此乃滋阴补阳之良品!望各位猿类好好享用)
君问归期未有期,巴山夜雨涨秋池! -------《夜雨寄北》