2021-11-29-ES9正则新特性.md

title	date	tags	author
ES9正则表达式新特性	2021-11-28 08:23:30 -0800	19 级 JavaScript ES9	郑世杰

ES9正则表达式新特性

1、正则命名分组

在es9之前使用正则表达式

let str = "abc123abc456";
const reg = /abc(.*)abc(.*)/;
const result = reg.exec(str);
console.log(result);
//结果如下
['abc123abc456', '123', '456']

如果正则表达式发生改变，那么后面访问正则表达式的匹配结果就需要修改，所以在es9之后可以这么写。

//语法为？<名称>
let str = "abc123abc456";
const reg = /abc(?<one>.*)abc(?<two>.*)/;
const result = reg.exec(str);
console.log(result.groups.one); //=>123
console.log(result.groups.one); //=>456

给匹配的结果命名，不用数组访问的方式，让代码可读性可维护性更高。

2、正则断言

正向断言

//语法：(?=XXX)  XXX是后面要跟的内容
let str = "abc123def456";
//使用断言
const reg1 = /[a-z]+(?=456)/;
const result1 = reg1.exec(str);
console.log(result1); //匹配到第二个字母串  def，因为后面有456
//不使用断言
const reg2 = /[a-z]+/;
const result2 = reg2.exec(str);
console.log(result2);  //匹配到第一个字母串 abc

反向断言

//语法：(?<=XXX)  XXX是前面要跟的内容
let str = "abc123def456";
//使用断言
const reg1 = /(?<=123)[a-z]+/;
const result1 = reg1.exec(str);
console.log(result1); //匹配到第二个字母串  def ，因为前面有123
//不使用断言
const reg2 = /[a-z]+/;
const result2 = reg2.exec(str);
console.log(result2);  //匹配到第一个字母串 abc

这样就可以判断目标前面或者后面跟着的内容了。

3、dotAll模式

在最后加一个s，可以让 . 匹配换行符。

let str = `
    <div>
        <span>123</span>
        <span>456</span>
    </div>
    <div>
        <span>abc</span>
        <span>def</span>
    </div>
    `;
const reg1 = /<div>\s+<span>(.*?)<\/span>/;
const reg2 = /<div>.*?<span>(.*?)<\/span>/s;  //替换后，少些几个\s
console.log(reg1.exec(str));
console.log(reg2.exec(str));
//都匹配 <div>    <span>123</span>