使用replaceAll()方法实现数字千分位逗号分隔

前言：

刷题过程中遇到要求把 数字按照千分位分隔，然后返回字符串，其实在前端开发中经常会遇到这样的一种需求,使用Javascript格式化数字进行输出，本文使用 ES6 的新增方法 replaceAll（）来实现这个需求 ，题目描述如下

---

 replaceAll()方法

replaceAll（）方法 是 replace（）方法的改进版 ，字符串的实例方法 replace()只能替换第一个匹配 ，如果要替换所有的匹配，不得不使用正则表达式的 /g修饰符进行全局匹配。但是replaceAll()方法，可以一次性替换所有匹配。（如下）

'aabbcc'.replace('b', '_')
// 'aa_bcc'
'aabbcc'.replace(/b/g, '_')
// 'aa__cc'
'aabbcc'.replaceAll('b', '_')
// 'aa__cc'

 replaceAll()方法第二个参数

replaceAll()的第二个参数是一个字符串，表示替换的文本，其中可以使用一些特殊字符串。

• $&：匹配的字符串。
• $` ：匹配结果前面的文本。
• $'：匹配结果后面的文本。
• $n：匹配成功的第n组内容，n是从1开始的自然数。这个参数生效的前提是，第一个参数必须是正则表达式。
• $$：指代美元符号$。

// $& 表示匹配的字符串，即`b`本身
// 所以返回结果与原字符串一致
'abbc'.replaceAll('b', '$&')
// 'abbc'

// $` 表示匹配结果之前的字符串
// 对于第一个`b`，$` 指代`a`
// 对于第二个`b`，$` 指代`ab`
'abbc'.replaceAll('b', '$`')
// 'aaabc'

// $' 表示匹配结果之后的字符串
// 对于第一个`b`，$' 指代`bc`
// 对于第二个`b`，$' 指代`c`
'abbc'.replaceAll('b', `$'`)
// 'abccc'

// $1 表示正则表达式的第一个组匹配，指代`ab`
// $2 表示正则表达式的第二个组匹配，指代`bc`
'abbc'.replaceAll(/(ab)(bc)/g, '$2$1')
// 'bcab'

// $$ 指代 $
'abc'.replaceAll('b', '$$')
// 'a$c'

 正则表达式（先行断言）

说这种方法前，我们来了解下什么是先行断言吧！看例子。（参考 原文链接）

有以下字符串: 我爱你 我爱 爱 爱你

如果要取出爱字，要求这个爱字后面有你，这个时候就要这么写，这就是 先行断言：

'我爱你 我爱 爱 爱你'.match(/爱(?=你)/g) // ["爱", "爱"]

如果要求爱字后面没有你，那自然也有先行否定断言：

'我爱你 我爱 爱 爱你'.match(/爱(?!你)/g) // ["爱", "爱"] ，因为匹配相同...

这个时候，如果要求爱字后面有你，前面还要有我，那就要用到后行断言了，如下：

'我爱你 我爱 爱 爱你'.match(/(?<=我)爱(?=你)/g) // ["爱"]

最后，如果要求爱字前面没有我，后面也没有我，那就要用到先行否定断言和**后行否定断言，**如下：

'我爱你 我爱 爱 爱你'.match(/(?<!我)爱(?!你)/g) // ["爱"]

 简单千分位分隔

使用 replaceAll()方法的第二个参数，代码简简单单就一行完成千分位分隔

 function _comma(number) {    
                return ((number+'').replaceAll(/\d{1,3}(?=(\d{3})+$)/g,'$&,'))
          }

 \d{1,3}   表示匹配 1至3 个数字字符

?=(\d{3})+$   表示后面匹配三个数字字符  $ 表示从行尾匹配

$&  是 replaceAll()方法的第二个参数，表示与匹配结果一致 ，$&, 表示匹配结果基础上加上 逗号 ，

 小改进（支持小数）

通过添加 三目运算符判 断字符串是否存在小数位， 其他逻辑代码不变

 // 加入三目运算符判断小数
          function _comma(number) {
             
                return !(number + '').includes('.') 
                ? ((number+'').replaceAll(/\d{1,3}(?=(\d{3})+$)/g,'$&,'))+'' 
                : ((number+'').replaceAll(/\d{1,3}(?=(\d{3})+(\.))/g,'$&,'))+''
            }

 console.log(_comma(1234567.36))      // 1,234,567.36

---

文章如有错误，恳请大家提出问题，本人不胜感激 。 不懂的地方可以评论，我都会一一回复

文章对大家有帮助的话，希望大家能动手点赞鼓励，大家未来一起努力     长路漫漫，道阻且长