js如何保留两位小数

转自:https://jingyan.baidu.com/article/fc07f98940143812ffe51939.html##1

写js代码的时候,会遇到小数类型数字,但是过长的小数位不利于页面显示,平常的计算过程也不会要求很高的精度,一般需要保留2位小数即可。下面就来介绍下js保留两位小数的几种方法

工具/原料

  • javascript

  • 浏览器调试工具

方法/步骤

  1. 方法一:使用toFixed保留两位小数

    var num1 = 55.3715; 

    console.log(num1.toFixed(2));

    打开浏览器调试工具,可以看到如下打印结果,55.37保留了两位小数,之后的两位舍弃

    js如何保留两位小数

  2. toFixed自带四舍五入的功能

    var num2 = 55.3755; 

    console.log(num2.toFixed(2));

    var num3 = 55.3745; 

    console.log(num3.toFixed(2));

    看下面打印结果,小数第三位为5时,或大于5时进一位,小于5后面几位直接舍弃

    js如何保留两位小数

  3. toFixed自带补位功能

    var num4 = 55.3; 

    console.log(num4.toFixed(2));

    var num5 = 55; 

    console.log(num5.toFixed(2));

    从打印结果可以看出,55.3补一位0,55补了两位00

    js如何保留两位小数

  4. 方法二:substr直接按字符串截取

    var num1 = 55.3785 + ""; 

    console.log("substr方式保留两位小数:");

    console.log(num1.substr(0,num1.indexOf(".")+3));

    这种方式没有四舍五入的功能,直接按位截取的,也没有补位功能

    js如何保留两位小数

  5. 方法三:浮点数四舍五入

    var num1 = parseFloat(55.7856); 

      if (!isNaN(num1)) { 

      num1 = Math.round(num1*100)/100; 

      console.log("将浮点数四舍五入,取小数点后2位:");

      console.log(num1);

      }

    js如何保留两位小数

  6. 上面的方法有四舍五入的功能,但没有补位的功能,可以通过以下方式实现

    var num1 = parseFloat(55); 

      if (!isNaN(num1)) { 

      num1 = Math.round(num1*100)/100; 

      var str = num1.toString(); 

       var rs = str.indexOf('.'); 

       if (rs < 0) { 

        rs = str.length; 

        str += '.'; 

       } 

       while (str.length <= rs + 2) { 

        str += '0'; 

       } 

      console.log("将浮点数四舍五入,取小数点后2位,位数不够进行补位:");

      console.log(str);

      }

    js如何保留两位小数步骤阅读

  7. 7

    以上就是js保留小数的几种方法,可以根据自己的需要选择

    END

### JavaScript中实现数值保留两位小数的方法 在JavaScript中,保留数值的两位小数可以通过多种方法实现。以下是几种常见的实现方式,并结合了相关引用内容进行了详细说明。 #### 方法一:使用 `toFixed` 方法 `toFixed` 方法可以将数字转换为指定小数位数的字符串形式。需要注意的是,该方法返回的是字符串类型,因此如果需要进行数值计算,应将其转换为数字类型[^4]。 ```javascript let number = 123.456; let result = Number(number.toFixed(2)); // 将字符串转为数字类型 console.log(result); // 输出结果:123.46 ``` 需要注意的是,`toFixed` 方法可能会存在舍入规则上的问题,例如 `1.005.toFixed(2)` 的结果是 `"1.00"` 而不是 `"1.01"`。此外,对于特殊值如 `NaN` 或 `Infinity`,`toFixed` 方法会直接返回对应的字符串形式。 #### 方法二:使用 `Math.round` 方法 通过 `Math.round` 方法可以实现四舍五入的功能,结合乘法和除法操作来保留两位小数[^4]。 ```javascript let number = 123.456; let result = Math.round(number * 100) / 100; // 先乘以100再除以100 console.log(result); // 输出结果:123.46 ``` 这种方法的优点在于返回值始终是数字类型,但需要注意对负数的处理以及四舍五入规则的应用[^4]。 #### 方法三:使用正则表达式 正则表达式可以用于格式化数值,确保其保留两位小数。这种方式适用于需要严格控制输出格式的场景[^2]。 ```javascript function keepTwoDecimal(num) { return num.toString().match(/^\d+(\.\d{0,2})?/)[0]; } let number = 123.456; let result = keepTwoDecimal(number); console.log(result); // 输出结果:123.45 ``` 需要注意的是,正则表达式方法可能无法正确处理某些特殊情况(如舍入),因此需谨慎使用[^2]。 #### 方法四:自定义函数实现 结合上述方法,可以编写一个更加通用的函数来保留两位小数。以下是一个示例函数[^1]: ```javascript function keepTwoDecimal(num) { var result = parseFloat(num); if (isNaN(result)) { console.error('传递参数错误,请检查!'); return false; } result = Math.round(num * 100) / 100; return result; } let number = 123.456; let result = keepTwoDecimal(number); console.log(result); // 输出结果:123.46 ``` 这种方法不仅实现了保留两位小数的功能,还增加了对输入参数的校验逻辑,提升了代码的健壮性[^1]。 ### 注意事项 - 如果需要确保数据类型为数字,建议优先使用 `Math.round` 方法或自定义函数。 - 对于需要格式化输出的场景,可以考虑使用 `toFixed` 方法或正则表达式。 - 在处理负数或特殊值时,务必测试不同方法的行为,以避免潜在问题。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值