正则表达式是前端开发中非常重要的一环，它可以用来处理字符串、验证表单等多个方面。ECMAScript 2019 （也就是 ES10）为我们提供了一些新的正则表达式功能，让我们更加高效地进行开发。本文将详细介绍这些新的功能，并给出示例代码和实际应用案例。
向后查看断言（Lookbehind）
向后查看断言是一种强大的正则表达式技术，能够在匹配字符串时限定某个位置之前的内容，从而更准确地筛选出目标字符串。ES10 中，我们可以使用 (?<=...) 这样的语法来实现向后查看断言。下面是一个示例：
const str = 'hello world'; // 匹配字符 "o"，但是前面必须是 "llo " const reg = /(?<=llo )o/g; console.log(str.match(reg)); // ["o"]
上面代码中，正则表达式 /(?<=llo )o/g 表示匹配字符 "o"，但必须在 "llo " 之后。注意，这个语法只是一个向后查看，不会真正匹配 "llo "，也不会替换掉 "llo "。
向后查看断言的应用场景非常广泛，比如匹配邮件地址中 @ 符号之前的内容，或者匹配 HTML 中特定标签的后面的内容等。
向前查看断言（Lookahead）
类似向后查看断言，ES10 中还提供了向前查看断言，可以在匹配字符串时限定某个位置之后的内容。用法也非常类似，只需要使用 (?=...) 语法即可。下面是一个示例：
const str = 'hello world'; // 匹配字符 "l"，但是后面必须是 "l" const reg = /l(?=l)/g; console.log(str.match(reg)); // ["l"]
上面代码中，正则表达式 /l(?=l)/g 表示匹配字符 "l"，但必须在另一个字符 "l" 之前。同样地，这个语法只是一个向前查看，不会匹配实际的 "l" 字符。
向前查看断言同样有很多应用场景，比如匹配 URL 地址中域名后面的路径等。
环视断言（Lookaround）
在 ES10 中，除了向前或向后查看之外，还可以使用环视断言（Lookaround）来限定匹配条件。环视断言其实就是上面两种断言的结合体，可以进行更加灵活的匹配。具体来说，环视断言包括：
- 向前否定查看断言：
(?!...) - 向前肯定查看断言：
(?=...) - 向后否定查看断言：
(?<!...) - 向后肯定查看断言：
(?<=...)
我们可以根据需要组合这些语法来实现精确匹配，下面是一个示例：
const str = 'hello world'; // 匹配 "o"，但是 "o" 两边必须都不是 "l" const reg = /(?<!l)o(?!=l)/g; console.log(str.match(reg)); // ["o"]
上面代码中，正则表达式 /(?<!l)o(?!=l)/g 表示匹配字符 "o"，但必须在其左右两边都不是 "l" 的情况下才行。这时候向后肯定查看断言和向前否定查看断言就可以结合起来使用了。
Unicode 属性转义符
在以前的 ECMAScript 标准中，正则表达式可以使用 \w 表示匹配任意一个字符或数字，\s 表示匹配任意一个空格或制表符等等。但是这些转义符只适用于 ASCII 字符集，无法匹配更广泛的 Unicode 字符。ES10 中提供了一种新的转义符 \p{}，可以匹配任意 Unicode 属性。例如，\p{Emoji} 可以匹配任何表情符号。
const str = '👍👎';
// 匹配任何表情符号
const reg = /\p{Emoji}/gu;
console.log(str.match(reg)); // ["👍", "👎"]上面代码中，正则表达式 /\p{Emoji}/gu 表示匹配任何表情符号，g 表示全局匹配，u 表示支持 Unicode 编码。当然，\p{} 还可以匹配其他 Unicode 属性，具体可以查看 MDN 文档。
Unicode 属性名称转义
除了使用 \p{} 表示 Unicode 属性之外，ES10 还提供了另外一种方法来匹配 Unicode 属性，就是使用 \p{name}，其中 name 是 Unicode 属性的名称。这种方法比较灵活，因为有些 Unicode 属性名称不是固定的，可能会包含变量和动态数据。例如：
const str = '🎉';
// 匹配任何带有“🎉”符号的 Unicode 属性
const reg = /\p{Emoji_Presentation}\{🎉}/u;
console.log(str.match(reg)); // ["🎉"]上面代码中，正则表达式 /\p{Emoji_Presentation}\{🎉}/u 表示任何带有“🎉”符号的 Unicode 属性，{🎉} 表示动态传入符号。需要注意的是，这种语法目前还处于 Stage 4 阶段，可能在未来的 ECMAScript 版本中有所改变。
总结
ES10 中提供的新正则表达式功能非常强大，虽然有些语法还没有普遍得到支持，需要在实际开发中注意兼容性和稳定性。无论如何，这些语法可以让我们更加灵活和高效地进行正则表达式操作，深度学习和掌握这些新功能对于前端开发人员来说是非常重要的。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a4f83948841e9894166a04