正则表达式是前端开发中的一项重要技能,能够有效地提高代码编写效率,同时也是增强代码可读性和维护性的重要手段。在 ECMAScript 2018(即 ES9)中,正则表达式得到了一些新的功能增强,其中值得关注的是负向环视的使用。
什么是负向环视
在正则表达式中,环视是指某个位置前面或者后面是否满足某个规则,例如正向前瞻就是指一个位置前面的字符能够匹配某个模式,它的写法类似于 (?=pattern)
。而负向环视则表示一个位置前面的字符不能匹配某个模式,它的写法类似于 (?!pattern)
。从语法上看,负向环视和正向前瞻的主要差别就在于匹配的正则表达式是用否定元字符 !
包裹起来的,而不是肯定元字符 =
。
我们可以通过下面的示例代码演示环视的基本使用:
// 匹配一个数字前面有一个美元符号的情况 const regex = /(?<=\$)\d+/; console.log(regex.exec('12.99 $1')); // [ '1', index: 8, input: '12.99 $1', groups: undefined ]
在上面的代码中,我们使用了正向前瞻 (?<=\$)
来匹配一个 $
符号前面的数字。如果我们想要匹配一个 !
符号前面的字符序列,可以使用负向环视 (?<!pattern)
的形式:
// 匹配一个字符前面没有一个感叹号的情况 const regex = /(?<!!)[A-Z]/; console.log(regex.exec('Hello!World')); // [ 'H', index: 0, input: 'Hello!World', groups: undefined ]
在上面的代码中,我们使用了负向环视的写法 (?<!!)
来匹配一个 !
符号前面没有出现的大写字母。
通过上面的基本示例,我们可以看到环视的基本用法和语法,下面我们将更深入地了解负向环视并探讨其实际应用。
负向环视的深度应用
负向环视的深度应用可以在正则表达式的处理过程中优化代码逻辑,有时候可以避免不必要的处理和额外的代码编写,从而提高代码的执行效率和可读性。
在实际开发中,我们可以使用负向环视技巧来过滤某些字符序列或者开头结尾的匹配,并进一步对匹配结果进行处理。例如,我们可以使用负向环视来识别 UTF-8 编码的非英文字母:
// 匹配除英文字符外的所有字符 const regex = /[^\x00-\x7F]+(?<![A-Za-z])/g; console.log(regex.exec('hello 世界 わたし')); // [ '世界', index: 6, input: 'hello 世界 わたし', groups: undefined ]
在上面的例子中,我们使用了负向环视 (?<![A-Za-z])
来过滤掉英文字符。我们首先使用 [^\x00-\x7F]+
匹配所有非 ASCII 字符,没有指定起始位置是因为整个过滤操作需要考虑开头结尾的情况。然后使用 (?<![A-Za-z])
来过滤掉英文字符,也就是匹配不以英文字符开头的所有字符。
除了过滤不必要的匹配,我们还可以使用负向环视来处理匹配结果。例如我们可以匹配一个数字列表,并排除掉其中多余的空格:
// javascriptcn.com 代码示例 // 匹配数字列表并排除多余空格 const regex = /(?<=\d)[, ]+(?=\d)(?<! )/g; console.log('1 , 2,3 ,4 ,10'); console.log( '1 , 2,3 ,4 ,10'.replace( regex, (match) => (match.includes(',') ? ',' : '') // 匹配到是逗号则替换为逗号,否则为一个空格 ) ); // 1,2,3,4,10
在上面的示例中,我们使用了负向环视来匹配数字列表中的逗号或者多余的空格,并排除掉前导或者后继的空格。当匹配到一个序列字符后,我们检查其是否包含 ,
符号,如果包含则替换为 ,
符号,否则替换为空格。最终结果会得到没有多余空格的数字列表。
总结
在本文中,我们介绍了 ES9 中正则表达式的负向环视,从基础语法到实际应用都进行了深度讲解。使用负向环视可以在正则表达式处理中更精准地过滤匹配,同时可以优化代码逻辑处理,提高代码可读性和执行效率。希望读者可以掌握负向环视的使用技巧,并在实际开发中灵活应用。
来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/653a34ce7d4982a6eb408338