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来说,12之间的位置是符合要求的,因为234567890符合 3 的要求,同理,45之间、78之间的位置也符合要求。

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

QQ截图20170925123634.png

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

QQ截图20170925123808.png

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

方法二:使用toLocaleString()方法

语法如下:

Number.toLocaleString('en-US');

举例:

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

结果是:123,456,789

toLocaleString()方法效果截图

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

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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值