我们经常遇到如下需要使用JS对数字进行格式化为每三位加一个逗号(JS三位分节法或者叫JS千分位加逗号)以方便阅读。使用JS实现这个功能的方法也有很多。
示例: 人均: 1,923,456.58元
如果你只需要一个简便的方法来完成工作,复制以下代码即可。
简便的方法
<script>
function thousands(num){
var str = num.toString();
var reg = str.indexOf(".") > -1 ? /(\d)(?=(\d{3})+\.)/g : /(\d)(?=(?:\d{3})+$)/g;
return str.replace(reg,"$1,");
}
console.log(thousands(1234567.1234567));
console.log(thousands(7654321));
</script>
如果你想一起探究,请继续阅读。
方法一【原生】:
<script>
function thousands(num){
return num.toLocaleString();
}
console.log(thousands(1234567.1234567));
console.log(thousands(7654321));
</script>
这个方法最为简单,使用JS原生实现。toLocaleString在将数字转换为字符串的同时,会使用三位分节法进行显示。如果是浮点数,只保留小数点后三位数,并进行了四舍五入。如果对结果要求不高,这个算是最简单的实现。
方法二【正则表达式】:
<script>
function thousands(num){
var str = num.toString();
var reg = str.indexOf(".") > -1 ? /(\d)(?=(\d{3})+\.)/g : /(\d)(?=(?:\d{3})+$)/g;
return str.replace(reg,"$1,");
}
console.log(thousands(1234567.1234567));
console.log(thousands(7654321));
</script>
利用正则表达式,也是代码量较少的一种方法。如果仅考虑整数,或指定位数的小数,可以更加简洁:
保留两位小数:
num.toFixed(2).toString().replace(/(\d)(?=(\d{3})+\.)/g,"$1,");
保留整数:
num.toFixed(0).toString().replace(/(\d)(?=(?:\d{3})+$)/g,"$1,");