正则巴啦啦

,

正则表达式描述了一中字符串匹配模式，可以用来检查一个串是否含有某种子串，将匹配的子串替换或者从某个串中取出某个条件的子串等。

1. 创建一个正则表达式

1. 使用一个正则字面量，其由包含在斜杠之间的模式组成：

1
2
let reg = /ab+c/;
let reg = /^[a-zA-Z]+[0-9]*\W?_$/gi;

2. 使用RegExp对象的构造函数：

1
2
3
let reg = new RegExp("ab+c");
let reg = new RegExp(/^[a-zA-Z]+[0-9]*\W?_$/ ,"gi");
let reg = new RegExp("^[a-zA-Z]+[0-9]*\W?_$", "gi");

2. 使用正则表达式

正则表达式可以被用于RegExp的exec()和test()方法以及String的match(), replace(), search()和split()方法。

方法 描述
exec 一个在字符串中执行查找匹配的RegExp方法，它返回一个数组（未匹配到则返回null）
test 一个在字符串中测试是否匹配的RegExp方法，它返回true或false
match 一个在字符串中执行查找匹配的String方法，它返回一个数组或者在未匹配到时返回null
search 一个在字符串中e测试匹配的String方法，它返回匹配到的位置索引，或者在失败时返回-1
replace 一个在字符串中执行查找匹配的String方法，并且使用替换字符串替换掉匹配到的子字符串
split 一个使用正则表达式或者一个固定字符串分隔一个字符串，并将分隔后的子字符串存储到数组中的String方法

3. 正则表达式中的特殊字符

字符 含义
^ 匹配输入的开始
$ 匹配输入的结束
* 0次或多次， 等价于{0,}
+ 一次或多次，等价于{1,}
? 0次或1次，等价于{0, 1}
. 匹配除换行符之外的任何单个字符
(x) 匹配x并且记住匹配项，此为捕获括号
(?:x) 匹配x但是不记住匹配项，此为非捕获括号
x(?=y) 匹配x仅仅当x后面跟着y，这种叫做正向肯定查找
x(?!y) 匹配x仅仅当x后面不跟着y，这个叫做正向否定查找
{n} 匹配发生次数
{n, m} 匹配前面的字符至少n次，最多m次
[xyz] 字符集合
[^xyz] 一个反向字符集
[\b] 匹配一个退格
\b 匹配一个词的边界
\B 匹配一个非单词边界
\d 匹配一个数字
\D 匹配一个非数字符
\f 匹配一个换页符
\n 匹配一个换行符
\r 匹配一个回车符
\s 匹配一个空白字符
\S 匹配一个非空白字符
\w 匹配一个单字字符
\W 匹配一个非单字字符

正则表达式标志符

标志 描述
g 全局搜索
i 不区分大小写搜索
m 多行搜索

4. 常用正则表达式

正则表达式写完后可以在线校验，校验网址在这里，以下是一些常用的正则校验：

1
2
3
4
5
6
7
手机号码 : ^(13[0-9]|14[0-9]|15[0-9]|166|17[0-9]|18[0-9]|19[8|9])\d{8}$
Email  : ^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$
身份证号 : ^((\d{18})|([0-9x]{18})|([0-9X]{18}))$
日期格式 : ^\d{4}-\d{1,2}-\d{1,2}$
中文字符 : [\u4e00-\u9fa5]
IP地址  : \d+\.\d+\.\d+\.\d+
QQ号    : [1-9][0-9]{4,}

5. ES6中的正则

1. 字符串的正则方法

字符串对象共有4个方法，可以使用正则表达式：match()、replace()、search()和split()。ES6将这4个方法，在语言全部调用RegExp的实例方法，从而做到所有与正则相关的方法，全部都定义在RegExp对象上。

  • String.prototype.match 调用 RegExp.prototype[Symbol.match]
  • String.prototype.replace 调用 RegExp.prototype[Symbol.replace]
  • String.prototype.search 调用 RegExp.prototype[Symbol.search]
  • String.prototype.split 调用 RegExp.prototype[Symbol.split]

2. u修饰符

ES6对正则表达式添加了u修饰符，含义为Unicode模式，用来正确处理大于\uFFFF的Unicode字符，也就是说，会正确处理四个字节的UTF-16编码。

1
2
/^\uD83D/u.test('\uD83D\uDC2A')  // false
/^\uD83D/.test('\uD83D\uDC2A')   // true

3. y修饰符

ES6还为正则表达式添加了y修饰符，叫做“粘连”修饰符。

y修饰符的作用与g修饰符类似，也是全局匹配，后一次匹配都从上一次匹配成功的下一个位置开始。不同之处在于，g修饰符只要剩余位置中存在匹配就可，而y修饰符确保匹配必须从剩余的第一个位置开始，这也就是“粘连”的涵义。

1
2
3
4
5
6
7
8
9
var s = 'aaa_aa_a';
var r1 = /a+/g;
var r2 = /a+/y;
// 待匹配字符串： aaa_aa_a
r1.exec(s) // ["aaa"]  
r2.exec(s) // ["aaa"]
// 剩余字符串： _aa_a
r1.exec(s) // ["aa"]  
r2.exec(s) // null

与y修饰符相匹配，ES6的正则实例对象多了sticky属性，表示是否设置了y修饰符。

1
2
3
4
var r = /hello/y;
r.sticky  // true 是否设置了修饰符
r.source  // ES5中就存在，返回正则表达式正文
r.flags   // y ES6中新增，返回正则表达式的修饰符

4. 具名组匹配

如下代码，正则表达式里面有三组圆括号。使用exec方法，就可以将这三组匹配结果提取出来。

1
2
3
4
5
6
const RE_DATE = /(\d{4})-(\d{2})-(\d{2})/;

const matchObj = RE_DATE.exec('1999-12-31');
const year = matchObj[1];   // 1999
const month = matchObj[2];  // 12
const day = matchObj[3];    // 31

组匹配的一个问题是，每一组的匹配含义不容易看出来，而且只能用数字序号（比如matchObj[1]）引用，要是组的顺序变了，引用的时候就必须修改序号。

ES2018 引入了具名组匹配（Named Capture Groups），允许为每一个组匹配指定一个名字，既便于阅读代码，又便于引用。

如果具名组没有匹配，那么对应的groups对象属性会是undefined。

1
2
3
4
5
6
const RE_DATE = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/;

const matchObj = RE_DATE.exec('1999-12-31');
const year = matchObj.groups.year;    // 1999
const month = matchObj.groups.month;  // 12
const day = matchObj.groups.day;      // 31