从一道笔试题，谈正则表达式的环视、捕获与非捕获
环视的四种类型
环视结构不匹配任何字符，只匹配文本中的特定位置。也称为零宽度断言。
类型 | 正则表达式 | 匹配成功的条件 | 匹配方向 |
|---|---|---|---|
肯定顺序环视 | (?=…) | 子表达式匹配右侧文本 | 从左到右 |
否定顺序环视 | (?!..) | 子表达式不能匹配右侧文本 | 从左到右 |
肯定逆序环视 | (?<=…) | 子表达式匹配左侧文本 | 从右到左 |
否定逆序环视 | (?<!..) | 子表达式不能匹配左侧文本 | 从右到左 |
以下是 Chrome(版本 99.0.4844.51)控制台的调试结果，其中否定逆序环视的支持还不完善。
let str = "77abc88";
str.replace(/(?=abc)/g, "#"); // '77#abc88'
str.replace(/(?!7)/, "#"); // '77#abc88'
str.replace(/(?<=abc)/g, "#"); // '77abc#88'
str.replace(/(?<!7)/, "#"); // '#77abc88'非捕获括号与捕获括号
let str = "abc abaa bb";
str.match(/(?:ab)+/g); // ['ab', 'ab']
str.replace(/(?:ab)+/g, "$1,"); // '$1,c $1,aa bb'
str.replace(/(ab)+/g, "$1,"); // 'ab,c ab,aa bb'可以从例子看出，(?:ab)并没有捕获并赋值给1，(ab)有捕获并赋值给1。
实战
给数字字符串加入千分位分隔符，比如 123,456,0
let str = "1234560";
str.replace(/(\d)(?=(?:\d{3})+$)/g, "$1,");解答过程如下：
- 非捕获括号匹配
连续的3个数字：(?:\d{3}) - 捕获括号匹配
连续3个数字前的单个数字：(\d)(?:\d{3}) - 加入环视：(\d)(?=(?:\d{3})+)，其中+的含义是，n 组连续 3 个数字结尾的字符串
- 替换：
$1,
最近笔者在整理第一本电子书书稿《前端面试手册》，有兴趣的同学可以关注下～
喜欢我文章的朋友，可以通过以下方式关注我：
- 「star」 或 「watch」 我的GitHub blog - RSS订阅我的个人博客：王先生的基地
关注
本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2022-03-12，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录