JS正则小结

痛定思痛。 2022-02-17 04:21 235阅读 0赞

## 新建 ##

新建有两种方式：  
    1. 使用字面量，如：var reg = /a/;  
    2. 使用RegExp构造函数，如：var reg = new RegExp(“a”);  
第一种方法在引擎编译代码时，就会新建正则表达式，第二种方法在运行时新建正则表达式，所以前者的效率较高。

## 实例属性 ##

1. RegExp.prototype.ignoreCase：返回一个布尔值，表示是否设置了i修饰符。  
    2. RegExp.prototype.global：返回一个布尔值，表示是否设置了g修饰符。  
    3. RegExp.prototype.multiline：返回一个布尔值，表示是否设置了m修饰符。  
    4. RegExp.prototype.lastIndex：返回一个数值，表示下一次开始搜索的位置。该属性可读写，但是只在进行连续搜索时有意义，详细介绍请看后文。  
    5. RegExp.prototype.source：返回正则表达式的字符串形式（不包括反斜杠），该属性只读。

```
    	var reg = /eft/igm;
    	reg.ignoreCase //true
    	reg.global //true
    	reg.multiline //true
    	reg.lastIndex //0
    	reg.source //eft
    	```

## 实例方法 ##

1.  test()，检测当前模式是否能匹配参数字符串。如：

/cat/.test("cat and dogs")   //true

如果正则表达式带有g修饰符，则每一次test方法都是从上一次结束位置开始匹配。

```
    	var reg = /a/g;
    	var str  = "abcabc";
    	
    	reg.lastIndex //0
    	reg.test(str) //true
    	
    	reg.lastIndex  //2
    	reg.test(str) //true
    	
    	reg.lastIndex  //4
    	reg.test(str) //false
    	```

每次的lastIndex都是上一次匹配的后一个位置。  
    带有g修饰符时，可以通过正则对象的lastIndex属性指定开始搜索的位置。

1.  exec，返回匹配结果。有匹配上，则返回一个数组，没匹配上就返回null。

var s = '_x_x';
    	var r1 = /x/;
    	var r2 = /y/;
    	
    	r1.exec(s) // ["x"]
    	r2.exec(s) // null

如果正则包含圆括号（组匹配），如果正则表示式包含圆括号（即含有“组匹配”），则返回的数组会包括多个成员。第一个成员是整个匹配成功的结果，后面的成员就是圆括号对应的匹配成功的组。也就是说，第二个成员对应第一个括号，第三个成员对应第二个括号，以此类推。整个数组的length属性等于组匹配的数量再加1。

var s = '_x_x';
    	var r = /_(x)/;
    	
    	r.exec(s) // ["_x", "x"]

利用g修饰符允许多次匹配的特点，可以用一个循环完成全部匹配

var reg = /a/g;
    var str = "abc_abc_abc";
    while(true){
    	var match = reg.exec(str);
    	if(!match)break;
    	console.log('#' + match.index + ':' + match[0]);
    }
    // #0:a
    // #4:a
    // #8:a

## 字符串示例方法 ##

1.  match，与exec类似。区别就是，如果带有g修饰符，则match会一次性返回所有匹配的结果。

var s = 'abba';
    	var r = /a/g;
    	
    	s.match(r) // ["a", "a"]
    	r.exec(s) // ["a"]

设置正则表达式的lastIndex属性，对match方法无效，匹配总是从字符串的第一个字符开始。

1.  search ,第一个满足条件的匹配结果在整个字符串中的位置。如果没有任何匹配，则返回-1。
2.  replace,替换匹配的值。它接受两个参数，第一个是正则表达式，表示搜索模式，第二个是替换的内容。如果不加g修饰符，就替换第一个匹配成功的值，否则替换所有匹配成功的值。

'aaa'.replace('a', 'b') // "baa"
    	'aaa'.replace(/a/, 'b') // "baa"
    	'aaa'.replace(/a/g, 'b') // "bbb"

replace方法的一个应用，就是消除字符串首尾两端的空格。

var str = '  #id div.class  ';
    	
    	str.replace(/^\s+|\s+$/g, '')
    	// "#id div.class"

replace方法的第二个参数可以使用美元符号$，用来指代所替换的内容。

*  $&：匹配的子字符串。
 *  $\`：匹配结果前面的文本。
 *  $’：匹配结果后面的文本。
 *  $n：匹配成功的第n组内容，n是从1开始的自然数。
 *  $ ： 指 代 美 元 符 号 ：指代美元符号 ：指代美元符号。

网页模板替换例子：

var prices = {
 	 'p1': '$1.99',
 	 'p2': '$9.99',
 	 'p3': '$5.00'
 	};
 	
 	var template = ''
 	 + ''
 	 + '';
 	
 	template.replace(
 	 /()(<\/span>)/g,
 	 function(match, $1, $2, $3, $4){
 	 return $1 + $2 + $3 + prices[$2] + $4;
 	 }
 	);
 	// "$1.99$9.99$5.00"

1.  split，按正则分割字符串

// 非正则分隔
    	'a,  b,c, d'.split(',')
    	// [ 'a', '  b', 'c', ' d' ]
    	
    	// 正则分隔，去除多余的空格
    	'a,  b,c, d'.split(/, */)
    	// [ 'a', 'b', 'c', 'd' ]
    	
    	// 指定返回数组的最大成员
    	'a,  b,c, d'.split(/, */, 2)
    	[ 'a', 'b' ]

需要注意的是正则默认是贪婪模式，如：

'aaa**a*'.split(/a*/)
    	// ["", "*", "*", "*"]

上面例子第一个分隔符是aaa（贪婪模式）,第二个分隔符是0个a（由于\*匹配任意个，0个a相对于空字符串），第三个分隔符是a，所以产生上述结果。

## 匹配规则 ##

1.  元字符  
    具有特殊意义的元字符  
    \\d 匹配0-9的数字,相当于\[0-9\]  
    \\D 匹配除了0-9的任意字符  
    \\w 匹配0-9、a-z、A-Z、\_ 的数字或字符,相当于\[0-9a-zA-Z\_\]  
    \\W 匹配不是字母、数字、下划线的字符  
    \\s 匹配任意不可见字符, 包括空格、制表符、换行符等  
    \\S 匹配任意可见字符  
    \\b 匹配单词的边界  
    \\t 匹配制表符  
    \\n 匹配换行  
    ^ 匹配字符串的开始位置  
    $ 匹配字符串的结束位置  
    \\ 转义字符  
    . 匹配除换行符以外的任意字符
2.  限定元字符  
    \+重复1次或更多次, 相当于\{1,\}  
    ? 重复0次或1次, 相当于\{0,1\}  
    \*重复任意次, 相当于\{0,\}  
    \{n\} 重复n次  
    \{n,\} 重复n次或者大于n次  
    \{n,m\} 重复n到m次
3.  其他  
    x | y x或者y  
    \[xyz\] x、y、z中的任意一个 例：\[abc\] 可以匹配add中的a  
    \[^xyz\] 除了xyz中的任意一个字符 例：\[abc\] 可以匹配add中的dd  
    \[a-z\] 匹配a-z中的任意一个字符  
    \[^a-z\] 匹配除了a-z中的任意一个字符  
    () 将括号里面的字符作为整体进行匹配, 括号里面的内容是一个子表达式或者叫分组

## 贪婪模式 ##

var s = 'aaa';
    s.match(/a+/) // ["aaa"]

消除贪婪模式

var s = 'aaa';
    s.match(/a+?/) // ["a"]

贪婪模式可参考此博文：[https://www.jb51.net/article/31491.htm][https_www.jb51.net_article_31491.htm]

## 先行断言 ##

x(?=y)称为先行断言（Positive look-ahead），x只有在y前面才匹配，y不会被计入返回结果。比如，要匹配后面跟着百分号的数字，可以写成/\\d+(?=%)/。

var m = 'abc'.match(/b(?=c)/);
    m // ["b"]

## 先行否定断言 ##

与先行断言相反。x只有不在y前面才匹配，y不会被计入返回结果。比如，要匹配后面跟的不是百分号的数字，就要写成/\\d+(?!%)/。

/\d+(?!\.)/.exec('3.14')
    // ["14"]

注意：本文参考阮一峰的JavaScript 标准参考教程（alpha），网址：[http://javascript.ruanyifeng.com/stdlib/regexp.html\#toc1][http_javascript.ruanyifeng.com_stdlib_regexp.html_toc1]

[https_www.jb51.net_article_31491.htm]: https://www.jb51.net/article/31491.htm
[http_javascript.ruanyifeng.com_stdlib_regexp.html_toc1]: http://javascript.ruanyifeng.com/stdlib/regexp.html#toc1