js正则表达式之前瞻后顾与⾮捕获分组
⽬录
前瞻后顾与捕获分组的结合使⽤
捕获分组与⾮捕获分组
前瞻、后顾与负前瞻、负后顾
总结
前瞻后顾与捕获分组的结合使⽤
在现实的应⽤场景中，捕获分组或⾮捕获分组通常被限制在前瞻后顾条件内，举例来说，对数字12345678格式化，结果为12,345,678。其正则实现如下：
let formatSum = '12345678'.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',')
捕获分组与⾮捕获分组
为了理解前瞻与后顾，⾸先要先理解捕获分组与⾮捕获分组
在js中，
()表⽰捕获分组，() 会把每个分组⾥的匹配的值保存起来，使⽤$n(n是⼀个数字，表⽰第n个捕获组的内容)；
正则匹配递增写法(?:)表⽰⾮捕获分组，和捕获分组唯⼀的区别在于，⾮捕获分组匹配的值不会保存起来。
以formatSum 表达式为例，(?=(?:\d{3})+(?!\d)) ，(?:\d{3}) ，(?!\d) 都是分组，其中第⼆个分组是⾮捕获分组。
前瞻、后顾与负前瞻、负后顾
在上述的formatSum表达式中，⽤到了 ‘?=‘与'?!'，这就是所谓的前瞻与负前瞻了。为了⽅便理解，我们以⼀个简单的例⼦⼊⼿。
// 前瞻：
A(?=B)  //查B前⾯的A
// 后顾：
(?<=B)A  //查B后⾯的A
// 负前瞻：
A(?!B)  //查后⾯不是B的A
// 负后顾：
(?<!B)A  //查前⾯不是B的A
回看formatSum表达式，将 (?:\d{3})+(?!\d) 视为⼀个整体表达式 A，即
formatSum = /\B(?=A)/g  //此处A为表⽰式并⾮真正字母A，只为⽅便理解
其意思是匹配表达式A前⾯的 \B ,⽽ \B 匹配的是⾮字母边界，所以可以看出该表达式整体的作⽤是⽤来匹配并替换表达式 A 前边的边界的。
与 \B 对应的还有 \b ，其匹配字母边界。对于初学者来说，边界的概念⽐较难以理解，你可以把它看作是⽆形的 | ，任何长度⼤于等于2的字符串中都存在边界。如 ‘ab'，它可以看作是'a|b'，只是此处 | 是⽆形的，当然它也就不计⼊字符串长度。
'ab'.replace(/\B/, ',')
//  a,b
接下来为了看表达式 A 部分： (?:\d{3})+(?!\d) 。
⾸先 ?: 表⽰⾮捕获分组，\d{3} 表⽰3位数字，则 (?:\d{3})+ 表⽰3、6、9、12…位数字；
(?!\d) 为负前瞻，表⽰匹配后⾯不是数字的 (?:\d{3})+ 。综上：
(?:\d{3})+(?!\d)
匹配'12345678'中后⾯不是数字的3*n(n=1递增)位数字，即'678', '345678'
所以，得出结果：
formatSum = '12345678'.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',')
匹配'12345678'中后⾯不是数字的3*n(n=1，n++)位数字前⾯的⾮字母边界，
即'678', '345678'前⾯的⾮字母边界，最终将这两个边界替换为逗号，
即 '3' 与 '6' 前加逗号
即
'12345678'.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',')  === '12,345,678'
// true
总结
到此这篇关于js正则表达式之前瞻后顾与⾮捕获分组的⽂章就介绍到这了，更多相关js正则前瞻后顾与⾮捕获分组内容请搜索以前的⽂章或继续浏览下⾯的相关⽂章希望⼤家以后多多⽀持！

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。