ES6学习笔记之正则扩展

Posted 2023-02-21 BennuCTech

RegExp

在 ES5 中，RegExp构造函数的参数有两种情况:

一是参数是字符串，第二个参数表示正则表达式的修饰符（flag）。

var regex = new RegExp('xyz', 'i');

二是，参数是一个正则表示式，这时会返回一个原有正则表达式的拷贝。

var regex = new RegExp(/xyz/i);

上面两种情况都等价于var regex = /xyz/i;

但是，ES5 不允许此时使用第二个参数添加修饰符，否则会报错。如下：

var regex = new RegExp(/xyz/, 'i');
// Uncaught TypeError: Cannot supply flags when constructing one RegExp from another

ES6 改变了这种行为。如果RegExp构造函数第一个参数是一个正则对象，那么可以使用第二个参数指定修饰符。而且，返回的正则表达式会忽略原有的正则表达式的修饰符，只使用新指定的修饰符。如：

new RegExp(/abc/ig, 'i')

上面代码中，原有正则对象的修饰符是ig，它会被第二个参数i覆盖。

Unicode 属性类

ES2018 引入了一种新的类的写法\\p…和\\P…，允许正则表达式匹配符合 Unicode 某种属性的所有字符。

具名组匹配

正则表达式使用圆括号进行组匹配。

const RE_DATE = /(\\d4)-(\\d2)-(\\d2)/;

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

const RE_DATE = /(\\d4)-(\\d2)-(\\d2)/;
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），允许为每一个组匹配指定一个名字，既便于阅读代码，又便于引用。

const RE_DATE = /(?<year>\\d4)-(?<month>\\d2)-(?<day>\\d2)/;
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

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

有了具名组匹配以后，可以使用解构赋值直接从匹配结果上为变量赋值。

let groups: one, two = /^(?<one>.*):(?<two>.*)$/u.exec('foo:bar');
one  // foo
two  // bar

字符串替换时，使用$<组名>引用具名组。

let re = /(?<year>\\d4)-(?<month>\\d2)-(?<day>\\d2)/u;
'2015-01-02'.replace(re, '$<day>/$<month>/$<year>')
// '02/01/2015'

String.prototype.matchAll()

ES2020 增加了String.prototype.matchAll()方法，可以一次性取出所有匹配。不过，它返回的是一个遍历器（Iterator），而不是数组。

遍历器转为数组是非常简单的，使用…运算符和Array.from()方法就可以了。

// 转为数组方法一
[...string.matchAll(regex)]
// 转为数组方法二
Array.from(string.matchAll(regex))

字符串的正则方法

字符串对象共有 4 个方法，可以使用正则表达式：match()、replace()、search()和split()。

u 修饰符

ES6 对正则表达式添加了u修饰符，含义为“Unicode 模式”，用来正确处理大于\\uFFFF的 Unicode 字符。

正则实例对象新增unicode属性(RegExp.prototype.unicode)，表示是否设置了u修饰符。

y 修饰符

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

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

ES6 的正则实例对象多了sticky属性(RegExp.prototype.sticky)，表示是否设置了y修饰符。

RegExp.prototype.flags 属性

ES6 为正则表达式新增了flags属性，会返回正则表达式的修饰符。

s 修饰符：dotAll 模式

正则表达式中，点（.）代表任意的单个字符，但是有两个例外。一个是四个字节的 UTF-16 字符，这个可以用u修饰符解决；另一个是行终止符（line terminator character）。

所谓行终止符，就是该字符表示一行的终结。以下四个字符属于“行终止符”。

• U+000A 换行符（\\n）
• U+000D 回车符（\\r）
• U+2028 行分隔符（line separator）
• U+2029 段分隔符（paragraph separator）

ES2018 引入s修饰符，使得.可以匹配任意单个字符。

/foo.bar/s.test('foo\\nbar') // true

这被称为dotAll模式，即点（dot）代表一切字符。所以，正则表达式还引入了一个dotAll属性，返回一个布尔值，表示该正则表达式是否处在dotAll模式。

后行断言

ES2018 引入后行断言，V8 引擎 4.9 版（Chrome 62）已经支持。