使用 ECMAScript 2018 的新特性简化正则表达式的编写
正则表达式是前端开发中非常基础且重要的知识点。正则表达式可以被用于字符串操作、输入验证、搜索引擎优化等很多方面。但是,正则表达式的语法和格式比较复杂,很难记忆和理解。好消息是,随着 ECMAScript 2018 的推出,新特性的加入让正则表达式的编写变得更加方便和简单了。
- ECMAScript 2018 中新增的正则表达式特性概述
ECMAScript 2018 中新增了一些实用的正则表达式特性,包括命名捕获组、dotAll 模式(单行模式)、反向断言和 Unicode 属性转义。这里将会分别介绍每一个特性。
1.1 命名捕获组
命名捕获组是一个可以通过一个有名字的键值对来捕获匹配结果的正则表达式分组。命名捕获组使用语法格式 "?<name>" 来定义一个组名。捕获结果可以通过组名来获取。
示例:
const str = "1234567890" const re = /(?<firstThree>\d{3})(?<secondFour>\d{4})(?<lastThree>\d{3})/ const capture = re.exec(str).groups console.log(capture) // { firstThree: "123", secondFour: "4567", lastThree: "890" } console.log(capture.firstThree) // "123" console.log(capture.secondFour) // "4567" console.log(capture.lastThree) // "890"
1.2 dotAll 模式
在 ECMAScript 中,点(.)是匹配除换行符外任何字符的通配符。但是,在某些情况下,我们可能需要在匹配过程中包括换行符。使用 dotAll 模式来达到这个目的。
示例:
const str = "first line\nsecond line" const re = /first.*second/ const dotAllRe = /first.*second/s console.log(re.test(str)) // false console.log(dotAllRe.test(str)) // true
1.3 反向断言
反向断言是一个零宽度断言,用来在匹配过程中查找某些东西并且只有它们前面或后面的某些条件成立后才进行匹配。
示例:
const str = "The quick brown fox jumped over the lazy dog." const re = /\b(?<=fox ).{5}\b/ console.log(re.exec(str)) // [ 'jumped', index: 16, input: 'The quick brown fox jumped over the lazy dog.' ]
1.4 Unicode 属性转义
Unicode 属性转义是一个用来在 Unicode 数据库里查找某一特定属性的新方法。它允许我们将一个 Unicode 属性转换成一个正则表达式里的一部分,从而可以判断一个字符是否满足这个属性。
示例:
const str = "红灯区" const re = /\p{Block=CJK_Symbols_And_Punctuation}/u console.log(re.test(str)) // true
- 使用 ECMAScript 2018 的正则表达式特性示例
像之前一样,我们来看一个具体的例子使用 ECMAScript 2018 的新特性简化正则表达式的编写:
需求:验证一个输入是否为合法 IP 地址。
传统方法就是使用这个 regex "^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?).){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$"。但是这个 regex 令人费解并且难以理解。现在我们将其转化为使用 ECMAScript 2018 正则表达式特性的简单版本:
// 如果是 IPv4 地址的话返回 true,否则返回 false function isIPv4Address(input) { const ipv4Regex = /(?<a>2[0-5][0-5]|[01]?[0-9][0-9]?)(\.)(?<b>2[0-5][0-5]|[01]?[0-9][0-9]?)(\.)(?<c>2[0-5][0-5]|[01]?[0-9][0-9]?)(\.)(?<d>2[0-5][0-5]|[01]?[0-9][0-9]?)/gm; return ipv4Regex.test(input); }
- 总结
通过本文,我们了解了 ECMAScript 2018 中的正则表达式新增特性,并通过一个具体例子展示了如何使用这些新特性来简化正则表达式的编写。虽然新特性不一定每个开发者都需要掌握,但是理解这些特性可以帮助我们在编写正则表达式的过程中更加便捷和高效。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64e5d55df6b2d6eab31504eb