美文网首页
JavaScript实现对数字进行千位逗号分隔符添加

JavaScript实现对数字进行千位逗号分隔符添加

作者: 且须文雅 | 来源:发表于2020-09-12 15:59 被阅读0次

    最近刷面试题遇到说要把数字转换成每三位添加一个逗号分隔符的问题,想起以前同事也问过我一个通过正则表达式来添加分隔符的问题,但当时没有进行记录,先在遇到,再次在网上搜罗,找到一位网友对这个问题的归纳研究(查看参考文章,我拿过来测试后,发现一些问题,对其进行一些优化后,在此给大家分享一下。

    解决方案

    1. 对数字进行取模
    2. 将数字转换成字符串,进行切片
    3. 使用正则表达式
    4. 使用Number自带的toLocaleString()方法

    方法一:

    function func1 (num) {
      if (num >= 1000) {
            let num1 = parseInt(num / 1000);
            let num2 = parseInt(num % 1000);
            num2 += '';
            num2.length < 3 && (num2 = '0'.repeat(3 - num2.length) + num2)
            const floatPart = !Number.isInteger(num) && '.' + num.toString().split('.')[1] || ''
            return func1(num1) + ',' + num2 + floatPart;
        } else {
            return num;
        }
    }
    

    方法二:

    function func2(num) {
      if (num > 1000) {
        [num, floatNum] = (num || 0).toString().split('.');
        let result = '';
        let str = ',';
        while (num.length > 3) {
            result = str + num.slice(-3) + result;
            num = num.slice(0, num.length - 3);
        }
        if (num) { result = num + result; }
        return result + (floatNum && `.${floatNum}` || '');
      }
      return num
    }
    

    这个方法将数字转成字符串,然后把字符串当成数组来处理,每次从字符串末尾取三个字符,加逗号,直到拿不出三个字符来,输出结果。

    方法三:

    function func3 (num) {
      // return num.toString().replace(/(?=(\B)(\d{3})+$)/g, ",");
      if (num < 1000) return num;
      if (Number.isInteger(num)) {
        return String(num).replace(/(?!^)(?=(\d{3})+$)/g, ',')
      } else {
        return String(num).replace(/(?!^)(?=(\d{3})+\.)/g, ',')
      }
    }
    

    方法四

    function func4(num) {
      return num.toLocaleString();
    }
    

    此方法根据系统环境不一,会有不一样的返回结果。

    通过测试,如果只针对整型数字而言,第一种方法可以说的一骑绝尘,1百万次测试耗时在60-80毫秒之间,二其他方法耗时是它的6-10倍不等。

    但在浮点数的处理上,它就稍逊于第三种方法了,处理浮点数,第一种方法和第二种方法性能相当,百万次耗时均在590-610ms之间,前者稳定在590-600ms之内,后者在600-610ms之内,而第三个方法则领先,百万次耗时在385ms左右,与它处理整型数据性能相差不大,处理整型数据时,耗时350ms左右。

    相关文章

      网友评论

          本文标题:JavaScript实现对数字进行千位逗号分隔符添加

          本文链接:https://www.haomeiwen.com/subject/hmhwektx.html