JS千分化数字

JS千分化数字

方法一：使用正则表达式

语法如下：

String(Number).replace(/(\d)(?=(\d{3})+$)/g, "$1,");

举例：

String(123456789).replace(/(\d)(?=(\d{3})+$)/g, "$1,");

结果是：123,456,789

下面对这个正则表达式进行解释。

1. \d{3}匹配3个连续的数字。

2. (\d{3})+是一个重复至少1次的分组，用来匹配3个连续数字，3个连续数字，3个连续数字，...。由于+是贪婪的，它总是匹配尽可能多的字符，此时对于字符串1234567890来说，(\d{3})+的匹配结果只有1个：123456789。

3. (\d{3})+$匹配这样的字符串，它的数字个数是3的倍数，并且最后必须是行的结尾。所以对于字符串123456789来说，匹配的结果是123456789，而对于1234567890，结果就是234567890。

4. (?=(\d{3})+$)匹配一个位置（零宽断言，即只匹配位置，不匹配任何实际的字符）。

   叫做前瞻，它匹配一个位置。B(?=A)匹配符合A，并且A之前紧挨着B的字符串，但是A只参与判断（断言），并不会包含在匹配的结果中。

所以(?=(\d{3})+$)的意思就好理解了。对于字符串1234567890来说，1和2之间的位置是符合要求的，因为234567890符合 3 的要求，同理，4和5之间、7和8之间的位置也符合要求。

1. 整个正则表达式的意思也就非常清晰了。(\d)(?=(\d{3})+$)是在 4 的基础上，前面跟着一个数字。所以，1和2之间的位置前面的字符是1。整个正则表达式的匹配结果就是

整个JavaScript语句String(Number).replace(/(\d)(?=(\d{3})+$)/g, "$1,");的执行结果如下：

其中的$1是对第一个分组的引用，"$1,"的意思是在原来字符串的基础上加上一个逗号,。

方法二：使用toLocaleString()方法

语法如下：

Number.toLocaleString('en-US');

举例：

(123456789).toLocaleString('en-US');

结果是：123,456,789

对于中文场景下，toLocaleString('en-US')中的'en-US'理论上是可以缺省的，也就是直接(123456789).toLocaleString()也是可以得到123,456,789。但是如果你的产品可能海外用户使用，则保险起见，还是保留'en-US'。

另外，对于IE edge之前的版本，Number.toLocaleString()会自动补上两位小数，如果是不需要的，需要自己额外过滤掉。