JS 数字的千位分隔法

最新推荐文章于 2022-11-22 11:50:43 发布

boboluotou

最新推荐文章于 2022-11-22 11:50:43 发布

阅读量913

点赞数 1

分类专栏： JS 前端面试

本文链接：https://blog.youkuaiyun.com/weixin_45798469/article/details/116518737

版权

JS 同时被 2 个专栏收录

17 篇文章

订阅专栏

前端面试

14 篇文章

订阅专栏

本文介绍了JavaScript中实现数字千位分隔的多种方法，包括使用正则表达式、遍历分隔以及reduce函数分隔。对于整数，通过正则匹配或数组操作可以实现；对于有小数的数字，可以先分离整数和小数部分，再进行分隔，或者直接使用toLocalString()函数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1 整数的千位分隔法

1.1 正则分隔

相关知识：

(?=p)，其中p是一个子模式，即p前面的位置。（hello (?=e) 指e前面的位置 “h#ello”）
(?!p)就是(?=p)的反面意思（hello (?!e) 指除e前面的位置 “#he#l#l#o#”）
写个正则不匹配任何东西： /.^/

数字的千分位就是把"12345678"，变成"12,345,678"

从后向前3位添加一个逗号

// 仅在最后加入一个逗号
var str = "12345678";
var reg = /(?=\d{3}$)/g
var res = str.replace(reg,',')
console.log(res)  // 12345,678
// 若想加多个逗号 需要添加一个 +

var str = "12345678";
var reg = /(?=(\d{3})+$)/g
var res = str.replace(reg,',')
console.log(res)  // 12,345,678
console.log("123456789".replace(reg,',')) // ,123,456,789
// 在最前面多添加一个逗号
// 需要把最前面的逗号去掉  (?!^)

// 最终版本
var str = "123456789";
var reg = /(?!^)(?=(\d{3})+$)/g
var res = str.replace(reg,',')
console.log(res)  // 123,456,789

1.2 遍历分隔

转换为数组，反转数组，三位添加一个逗号，反转数组，转换为字符串输出。

function solve(arr) {
    var res = [];
    for(let i=0,len = arr.length;i<len;i++){
        if(i%3==0 && i!=0){
            res.push(",");
        }
        res.push(arr[i]);
    }
    res.reverse();
    return res;
}
function numFormat(num){
    num=num.toString().split(".");  // 分隔小数点
    var arr=num[0].split("").reverse();  // 转换成字符数组并且倒序排列
    var res=[];
    res = solve(arr);

    if(num[1]){  // 如果有小数的话添加小数部分
        var ans = [];
        ans = solve(num[1].split("").reverse()); // [ '4', ',', '5', '4', '2' ]
        ans = ans.join("")  // 4,542
        res=res.join("").concat("."); // 673,439.
        res = res.concat(ans) // 673,439.4,542
    }else{
        res=res.join("");
    }
    return res;
}

var a=1234567894532;
console.log(numFormat(a)); // "1,234,567,894,532"

var b=673439.4542;
console.log(numFormat(b)); // "673,439.4542"

1.3 refuce函数分隔

function f(str) {
    const ret = Array.from(str).reverse().reduce((result,next,i,arr) => {
        if((i+1)%3 === 0 && (i+1) !== arr.length) {
            result.push(next,',')
            return result;
        }
        result.push(next);
        return result;
        // return (index % 3) ? (next + "" + pre) : (next + ',' + pre);
    },[])
    return ret.reverse().join('');
}
var s = "12345678076"
console.log(f(s)) // 12,345,678,076

2 有小数划分

2.1 正则化分隔

有小数部分的数字，只需把小数和整数部分分隔开，各自添加逗号分隔，然后合并即可，以上三种方法都适用。

function numFormat(num){
    num=num.toString().split(".");  // 分隔小数点  [ '1234567', '9805641' ]
    var res=[];
    var arr=num[0];  // 整数部分
    var arr1=num[1];  // 小数部分
    var reg=/(?!^)(?=(\d{3})+$)/g;
    res=arr.replace(reg,','); // 1,234,567
    arr1=arr1.replace(reg,','); // 9,805,641
    res=res.concat(".",arr1) // 1,234,567.9,805,641
    return res;
}

console.log(numFormat(1234567.9805641))

2.2 toLocalString()函数

此函数仅保留小数点后三位

var a = 8462948.24234;
console.log(a.toLocaleString()) // 8,462,948.242

js正则化参考链接