正则表达式中捕获性分组和非捕获型分组讲解及实例

​

捕获型()

反向引用

\1

‘\1’ 匹配的是 所获取的第1个()匹配的引用,与第一个分组字符相同.
例如，’(\w)\1’ 匹配两个连续数字字符。如33aa 中的33
如下例子aabbccdddef:
如a,下一个字母也是a则匹配成功.
到第三个d,前面两个d已经匹配成功,所以看d后面的字符,是e,匹配失败!

var str=' aabbccdddef' 
var reg=/(\w)\1/g   
//\w 元字符用于查找单词字符。
// \1 反向引用引用前面分组的值 
console.log(str.match(reg));
==>[aa,bb,cc,dd]

这里是两个\1,也就是匹配两次 也就是有两个字符要与第一个分组所匹配
匹配三个连续字符,如333aa 中的333

var reg=/(\w)\1\1/g 
var str=' aabbccdddef' 
console.log(str.match(reg));
==>[ddd]

\2

如果是\2，就是匹配第二个()匹配到的内容，再用一个稍微简单的例子理解一下：
(x)(y)\2 该正则是想匹配到第一个字符是x,第二个字符是y，第三个字符也是y的内容，比如xyy能够被匹配到，但是xya、xyb就不能被匹配到。
同理 \3 \4 \5一样!

var reg=/(x)(y)\2/g
var str='xyaxyyxyb'
console.log(str.match(reg)) 
==>[xyy]

练习一下

var reg=/(\w)(\w)(\w)\2\3\1\3\2\1/g
var str='daabcbcacbadd' 
console.log(str.match(reg));
==>[abcbcacba]

进阶分组嵌套练习

若有不懂在下面留言,或者自行运行!

var str=' abc 123 abc  abc '
 var reg=/(\s([a-z]+)\s)\d+\1\1/
 console.log(str.match(reg));
==>0: " abc 123 abc  abc "
   1: " abc "
   2: "abc"

​

var str=' abc 123 abc abc123
var reg=/(\s([a-z]+)\s)(\d+)\1\2\3/
console.log(str.match(reg));
​
==>0: " abc 123 abc abc123"
   1: " abc "
   2: "abc"
   3: "123"

​

var str=' abc 123 abc abc123 '
var reg=/(\s([a-z]+)\s)(\d+)\1\2\3/
console.log(str.match(reg));//
console.log(RegExp.$1);

//要匹配之后 可以在正则外面捕获
console.log(RegExp.$2);//要匹配之后
console.log(RegExp.$3);//要匹配之后
​
==> abc 
   abc
    123
交换位置
var str = "Doe, John";
console.log(str.replace(/(\w+),\s(\w+)/,"$2 $1"))​
==>John Doe

非捕获型()

非捕获性分组工作模式下分组(?:)会作为匹配校验，并出现在匹配结果字符里面，但不作为子匹配返回。

//先看用捕获性分组匹配会返回什么
var str1 = '000aaa111';             
var pattern = /([a-z]+)(\d+)/; //捕获性分组匹配
var arr = pattern.exec(str1);  
console.log(arr) 

==>['aaa111','aaa','111'] 

​
​

//非捕获性分组
var str2 = '000aaa111';
var pattern2 = /(?:[a-z]+)(?:\d+)/; //非捕获性分组匹配
var arr2 = pattern2.exec(str2);  
console.log(arr2)
==>['aaa111']    

var str= 'http://www.google.com' 
var reg=/(?:http|https):\/\/([^\r\n]+)/
console.log(str.match(reg))
==>www.google.com

var str=' foofoo'
var reg=/(?:foo){2}/ 
console.log(str.match(reg));
console.log(RegExp.$1);
==>foofoo

前瞻

前瞻分为正向前瞻和反(负)向前瞻，

正向前瞻(?=表达式)表示后面要有什么，反向前瞻(?!表达式)表示后面不能有什么。

正向前瞻型/先行断言 ?=

括号里面的部分不会返回 //前瞻,可以放在位置不固定，可前匹配和后匹配

// 括号里面的部分不会返回 
//前瞻,可以放在位置不固定，可前匹配和后匹配
 var str= 'abc'
 var reg=/b(?=c)/ //b后面必须是c或者c前面必须是b
 console.log(str.match(reg));
==>b

var str=' sex:女;age=20 '
var reg=/\w*(?==)/|
console.log(str.match(reg)); 
==>age

var str='kid is a doubi '
var reg=/kid is a (?=doubi)/
console. log(str. match(reg));
==>kid is a 

前瞻分组会作为匹配校验，但不出现在匹配结果字符里面，而且不作为子匹配返回。

//正向前瞻，匹配.jpg后缀文件名
var str = '123.jpg,456.gif,abc.jpg';
var partern = /\w+(?=\.jpg)/g; //正向前瞻匹配
console.log(str.match(partern));
==>['123', 'abc']   

反向前瞻型分组/否定断言 (?!)

//反向前瞻，匹配3个及以上的a，而且后面不能有000的字符
var str = 'aaa000 aaaa111 aaaaaaa222';
var partern = /a{3,}(?!000)/g; //反向前瞻匹配
console.log(str.match(partern)); 
==>['aaaa', 'aaaaaaa']   

var reg=/\d{4}(?!\.)/
  var str= '725.34555'
 console.log(str.match(reg));// 如果次数大于前一个的，就返回后面的
 ==>3455

  var reg=/\d{2}(?!\.)/
  var str= '725.34555'
  console.log(str.match(reg));// 
  ==>72