js千分位实现方法大汇总
短信预约 -IT技能 免费直播动态提醒
千分位实现汇总
1.最最便捷的实现方式:toLocaleString()
注:只针对数字格式有效!
let num = 1234567890;
num.toLocaleString(); //"1,234,567,890"
2.正则匹配
// 正则匹配方法一
let num = 1234567890;
let reg = /\d{1,3}(?=(\d{3})+$)/g;
String(num).replace(reg, '$&,'); //"1,234,567,890"
// 正则匹配方法二
let num = 1234567890;
let reg = /\B(?=(\d{3})+$)/g;
String(num).replace(reg, ','); //"1,234,567,890"
说明:如果想知道具体怎样的分组方式,可在 [https://regexper.com/](https://regexper.com/) 上测试
1. ?= 表示正向引用
2. $& 表示与正则表达式相匹配的内容,可查看replace()
3. \B 非单词边界
3.for循环
// for循环方法一
function format(num){
num = String(num);//数字转字符串
let str = '';//字符串累加
for (let i = num.length- 1, j = 1; i >= 0; i--, j++){
if (j%3 == 0 && i != 0){ //每隔三位加逗号,过滤正好在第一个数字的情况
str += num[i] + ','; //加千分位逗号
continue;
}
str += num[i]; //倒着累加数字
}
return str.split('').reverse().join(""); //字符串=>数组=>反转=>字符串
}
let num = 1234567890;
format(num); //"1,234,567,890"
// for循环方法二
function format(num){
num = String(num);//数字转字符串
let str = '';//字符串累加
for (let i = num.length- 1, j = 1; i >= 0; i--, j++){
if (j%3 == 0 && i != 0){ //每隔三位加逗号,过滤正好在第一个数字的情况
str = ',' + num[i] + str; //加千分位逗号
continue;
}
str = num[i] + str; //累加数字
}
return str;
}
let num = 1234567890;
format(num); //"1,234,567,890"
4.slice+while循环
function format(num) {
let arr = [],
str = String(num),
count = str.length;
while (count >= 3) {
arr.unshift(str.slice(count - 3, count));
count -= 3;
}
// 如果是不是3的倍数就另外追加到上去
if(str.length % 3) arr.unshift(str.slice(0, str.length % 3));
return arr.toString();
}
let num = 1234567890;
format(num); //"1,234,567,890"
5.reduce
function format(num) {
var str = num+'';
return str.split("").reverse().reduce((prev, next, index) => {
return ((index % 3) ? next : (next + ',')) + prev;
})
}
let num = 1234567890;
format(num); //"1,234,567,890"
当然也存在很多类似的写法,不一一列举了~
千分位分隔符
方法一
没有小数位时
formatMoney(num) {
let reg=/\d{1,3}(?=(\d{3})+$)/g;
return (num + '').replace(reg, '$&,');
}
方法二
有小数位时
formatThousand(money) {
let res = money.toString().replace(/\d+/, function(num){ // 先提取整数部分
return num.replace(/(\d)(?=(\d{3})+$)/g, function($1){
return $1+",";
});
})
return res;
},
以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。
免责声明:
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341