分组和子项
利用()
对正则表达式里面的子项进行分组
声明一个变量
var str1 = '1970-2-1';
当没有括号的时候
var re1 = /\d-+/g;
console.log(str1.match(re1)); //["0-", "2-"]
有括号的时候
var re2 = /(\d-)+/g;
console.log(str1.match(re2)); //["0-2-"]
/\d-+/g
匹配到的是数字后面有一个或者多个-
的字符,所以结果与/(\d-)+/g
的内容不相同
改变一下字符串,这样的差距会看的更加明显
var str2 = '1970---2---1'
var re1 = /\d-+/g;
console.log(str2.match(re1)); //["0---", "2---"]
var re2 = /(\d-)+/g;
console.log(str2.match(re2)); //["0-", "2-"]
分组中的match()方法
如果正则里面存在分组,那么match()方法的返回值会变得不同
当正则中存在分组,且没有修饰符g的时候,会返回一个数组,数组的第一个值为首先匹配到的结果,后面的值为分组的所有子项匹配到的内容,且还有index
和input
属性
var str = '1970-2-1';
var re1 = /(\d+)-/;
console.log(str.match(re1)); //["1970-", "1970", index: 0, input: "1970-2-1"]
var re2 = /(\d+)(-)/;
console.log(str.match(re2)); //["1970-", "1970", "-", index: 0, input: "1970-2-1"]
console.log(str.match(re2)); //["1970-", "2-"]
分组中的replace()方法
如果正则里面存在分组,那么replace()方法中的第二个参数为函数时,函数的参数也会不同
当正则存在存在分组,且没有修饰符g的时候,函数的参数情况如下:
- 第一个参数为匹配到的字符串
- 倒数第二个参数为匹配到的字符串对应的下标值
- 最后一个参数为原字符串
-
正则中,有多少个分组,中间就有多少个参数,它们分别对应各个分组的匹配到的内容
例如,有三个分组,那么第2、3、4个参数就为各个分组的匹配到的内容
var str = '1970--2-1';
var re1 = /(\d+)(-)(-)/;
var newStr1 = str.replace(re1,function($0,$1,$2,$3,$4,$5){
console.log($0); //1970--
console.log($1); //1970
console.log($2); //-
console.log($3); //-
console.log($4); //0
console.log($5); //1970-2-1
})
简单的例子-格式化日期
这里有多个日期字符串,它们的格式很乱,我们需要将它们转化为统一的格式“1970年02月01日”
var str1 = '1970--02---01';
var str2 = '1970asdfi02-/*01'
var str3 = '1970)*(_02/*-01'
我们可以发现它们的内容其实是很规律的,都是数字+其他字符+数字+其他字符+数字
,那么只需要将其他字符替换为汉字“年”“月”,并在字符串的后面加上“日”就可以完成这个功能了
那么如何一一对应的去替换这些内容呢?考虑到replace()方法中第二个参数为函数时,函数的部分参数对应的是正则分组中的内容就可以轻松的解决了
首先需要一个正则,匹配到整个字符串
var re = /\d+\D+\d+\D+\d+/;
然后通过分组让函数的参数可以一一对应,将年、月、日这三个字和这些参数代表的字符串拼接在一起就可以了
var re = /(\d+)\D+(\d+)\D+(\d+)/;
var newStr = str.replace(re,function($0,$1,$2,$3){
return $1+'年'+$2+'月'+$3+'日';
});