JS内置对象5：正则RegExp

定义

字符串匹配工具。

风格

1. JS风格，其实就是通过new关键字实例化一个正则对象；
   new RegExp("查询字符串","模式/规则")

2. perl风格
   /查询字符串/模式/规则
   
   

规则/模式

i    忽略大小写

g    找到全部匹配结果

m    多行搜索（换行了，依然可以匹配到）

量词

元字符

元字符，是拥有特殊含义的字符。

.     除了换行符和结束符

\w    [a-zA-Z0-9_]   注意还包含下划线！！！

\W    [^a-zA-Z0-9_]

\d    [0-9]

\D    [^0-9]

\s    空白字符

\S    非空白字符

\b    单词边界    左边界写法：\b字符  右边界写法：字符\b

\B    非单词边界

\0    NULL

\n    换行符

\f    换页符

\r    回车符

方括号查询参数

正则自身的属性

• global：是否全文搜索 默认false

• ignore case：是否大小写敏感 默认false

• multiline：多行搜索 默认false

• lastIndexof：当前匹配项的最后一个字符的下一个位置

• source：正则表达式的文本 不包含模式/规则

正则自身的方法

test( )

检验字符串，是否符合正则表达式要求。


语法：

正则对象.test(字符串)

实例：

var str = "12345678";
var re = /\d[3,6]?/g;

if(re.test(str)){
    alert('老铁，没毛病！');
}else{
     alert('老铁，这不符合条件，快检查一下!');
}

exec( )

搜索字符串，并更新正则对象属性。

如果没有匹配结果，返回null，否则返回一个数组。


该数组的属性：

index ：声明匹配文本的第一个字符位置

input ：存放被检索的字符串string

语法：

正则对象.exec(字符串)

在使用时，全局调用（g模式）和非全局调用（没有g规则）是有区别的。

全局调用lastIndex是动态的；非全局是静态，并且为0。

实例1：

非全局调用

返回值：

第一个元素：匹配项
第二个元素：子表达式（分组）的匹配项
第三个元素：第二个子子表达式（分组）的匹配项，以此类推

var reg1 = \d(\w)(\w)\d;
var str  = "$1ab2f2";

var ret = reg1.exec(str);

console.log(reg1.lastIndex); // 0  
console.log(ret.index); // 1
console.log(ret.toString()); // 1ab2 a b

实例2：

和非全局调用类似，只是lastIndex生效了。

var reg2 = \d(\w)(\w)\d/g;
var str  = "$1ab2ff34cd5ee";

var ret = reg2.exec(str);

console.log(reg2.lastIndex); // 5  12  
console.log(ret.index); // 1  8
console.log(ret.toString()); // 1ab2 a b   4cd5 c d

字符串与正则配合

search(正则)

字符串搜索，不支持全局搜索（g模式）。


返回值：

匹配成功返回首次匹配项的索引。
否则，返回 -1。

实例：

'a1b1c1'.search(/1/);  // 1

match(正则)

字符串搜索，返回匹配到的内容。

返回值：

如果没有匹配成功，就会返回null。


非全局调用

如果没有添加g规则，只会返回首次匹配项。并且返回匹配项组成的一个数组。

该数组的属性：

• index 匹配文本起始字符的索引

• input 对字符串对象的引用

全局调用

返回一个数组。

没有index和input属性。

实例1：

非全局调用

返回值：

第一个元素：匹配项
第二个元素：子表达式（分组）的匹配项
第三个元素：第二个子子表达式（分组）的匹配项，以此类推

var reg1 = /\d(\w)\d/;
var str  = "$1a2b3c4d5e";
var ret  = str.match(reg1);

console.log(ret); // ["1a2","a"]
console.log(ret.index); // "a"
console.log(reg1.lastIndex); // "0"

实例2：

全局调用

var reg2 = /\d(\w)\d/g;
var str  = "$1a2b3c4d5e";
var ret  = str.match(reg2);

console.log(ret); // ["1a2","3c4"]
console.log(ret.index); // "undefined"
console.log(reg2.lastIndex); // "0"

replace(正则)

替换所有匹配项。

语法：

字符串对象.replace(正则,替换字符串);

字符串对象.replace(正则,函数);  不推荐

函数有四个参数：
1. 匹配字符串
2. 正则分组内容（没有分组，就没这个参数）
3. 匹配项的索引
4. 原字符串


返回值： 替换成功后的字符串（string）


实例：

函数
'a1b2c3d4e5'.replace(/\d/g,function(match,index,origin){
    return parseInt(match)+1;
});

分组

我们想要匹配一个字符串3次，可能一下子会想到使用{3}的方式。但其实这样做并不能达到我们的预期结果。

因为{ }只作用于最靠近它的字符。


实例：

Hello{3}

使用( )可以达到分组，使量词作用于分组。

(Hello){3}

| 或

你 我 (他|她)

您好 | 你好

$反向引用

语法：

/(分组1)分隔符（分组2）分隔符......（分组n）/

$n：分组n


例如我们需要选择一个日期

var str = "2017-09-13",
    re  = /(\d{4})-\d({2})-(\d{2})/g;

str.replace(re,'$2$3$1');

忽略分组

如果不希望捕获一些分组，只需要在分组内加上？：就行了。

(?:不需要).(需要)

前瞻

前瞻就是在正则表达式匹配到规则的时候，向后检查是否符合断言。

符合断言——正向前瞻

不符断言——负向前瞻

语法：

正则表达式(?=断言)      正向前瞻

正则表达式(?!断言)      负向前瞻

实例1：

匹配一个单词，这个单词它的后面要跟着数字。然后把单词替换成“X”。

'a1_3'.replace(/\w(?=\d)/g,'X');  // "X1*3"

实例2：
匹配一个单词，这个单词它的后面不跟着数字。然后把单词替换成“X”。

'a1_3'.replace(/\w(?!\d)/g,'X');  // "aX_X"

贪婪模式和非贪婪模式

跟量词有联系！！！

贪婪模式

它会尽可能多地匹配。

如：

它会一次匹配到6个数字。

var str = "12345678";
var re = /\d{3,6}/g;

console.log(str.replace(re,'x'));  // x78

非贪婪模式

在区间｛｝后面加上？ ，也就是{区间}?

如：

它一次只匹配三个数字，并最终匹配了2次。

var str = "12345678";
var re = /\d{3,6}?/g;

console.log(str.replace(re,'x'));  // xx78

补充：

可视化工具——resexper

官网