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})+ 。韩国站群服务器http://www.558idc.com/krzq.html综上:
(?:\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正则前瞻后顾与非捕获分组内容请搜索hwidc以前的文章或继续浏览下面的相关文章希望大家以后多多支持hwidc!