原文:请使用千位分隔符(逗号)表示web网页中的大数字
javascript实现将数字转成千分位的方法小结【5种方式】
1、利用正则的零宽度正预测先行断言(?=exp),名字有点难记,意思是它断言自身出现的位置的后面能匹配表达式exp,对此概念还不明白的可以戳这里,这里不做过多解释。数字千分位的特点是,第一个逗号后面数字的个数是3的倍数,正则:/(\d{3})+/,分隔符要从前往后加,就要将前面的数字“87”替换成“87,”,为什么是87不是874?因为874后面只剩下5位数字,在632后加一个分隔符后,将只剩下97,不符合千分位要求,所以第一个分隔符后面的数字位数必须是3的倍数。要匹配数字87,又要保证87后面数字位数是3的倍数,并且要将匹配的87替换成“87,”,就要用到(?=exp),这里先定义一个变量var str = "87463297";
// 零宽断言
console.info( str.replace(/\d{1,3}(?=(\d{3})+$)/g,function(s){
return s+','
}) )
// or
String(Number).replace(/(\d)(?=(\d{3})+$)/g, "$1,");
2、利用正则的子项来替换,跟第1种方法类似。
// 子项
console.info( str.replace(/(\d{1,3})(?=(\d{3})+$)/g,function($1){
return $1=$1+','
}) )
3、使用toLocaleString()方法
对于中文场景下,toLocaleString('en-US')中的'en-US'理论上是可以缺省的,也就是直接(123456789).toLocaleString()也是可以得到123,456,789。但是如果你的产品可能海外用户使用,则保险起见,还是保留'en-US'。
另外,对于IE edge之前的版本,Number.toLocaleString()会自动补上两位小数,如果是不需要的,需要自己额外过滤掉。
Number.toLocaleString('en-US');
4、先将字符串转成数组,利用reverse反转数组后每3个数字后添加一个分隔符“,”,到字符串末尾除外,之后转回字符串。
// 利用字符串和数组方法
console.info( str.split("").reverse().join("").replace(/(\d{3})+?/g,function(s){
return s+",";
}).replace(/,$/,"").split("").reverse().join("") )
5、利用while循环拼接字符串每隔3个数字加一个分隔符,首尾不加
// 利用循环拼接字符串每隔3个加一个分隔符
var result="",
index = 0,
len = str.length-1;
while(len>=0) {
index%3===0&&index!==0 ? result+=","+str[len] : result+=str[len];
len--;
index++;
};
result=result.split("").reverse().join("");
console.info(result);
6、利用while循环在数组里push分隔符,首尾不加
// 利用while循环在数组里push分隔符
var result="",
index = 0,
len = str.length,
i = len-1,
arr = str.split("");
while(len-index>0){
len>=index&&len-index!==len && arr.splice(len-index,0,",");
index+=3;
i-=4;
};
console.log(arr.join(""));