js保留两位小数_javascript保留两位小数

前言

在开发中展示点赞数时,当数量级超过10000后,需要使用更加简洁的小数式去显现数量(例如1.22万)。下面就给大家分享数量小数式后保留两位小数的实现方式。

ced52716b5ab5b3f30d639173f74ba00.gif ced52716b5ab5b3f30d639173f74ba00.gif ced52716b5ab5b3f30d639173f74ba00.gif

四舍五入

使用toFixed()方法处理小数的四舍五入,运行示例如下。

// 四舍五入var num =2.2354234234;num = num.toFixed(2);console.log('num=', num);
edfe031cde25a6ed7bbc50d91c91aa67.png运行测试结果

6b003dc89d9340e20f399ff92447cf4f.png

73e5eb382b4d37257c4585733f567f39.gif

不四舍五入

不四舍五入有两种方案,一种是Math.floor()方法,一种是正则匹配。运行示例如下。

1

Math.floor() —— 先将小数变整数,然后再保留小数位数  

// Math.floor()var num2 = Math.floor(2.2344234234 * 100) / 100;console.log('num2=',num2);
edfe031cde25a6ed7bbc50d91c91aa67.png运行测试结果

aee4d031b2a768d9c65841af2a96db52.png

2

正则匹配 —— 先将小数转换为字符串,再使用正则匹配输出保留小数位数

// 正则匹配var num3 = Number(6.2344234234.toString().match(/^\d+(?:\.\d{0,2})?/));console.log('num3=',num3);
edfe031cde25a6ed7bbc50d91c91aa67.png运行测试结果

3d45b8a62daebd9c04aa990ef4f1c281.png

ced52716b5ab5b3f30d639173f74ba00.gif ced52716b5ab5b3f30d639173f74ba00.gif ced52716b5ab5b3f30d639173f74ba00.gif

Math.floor()方法存在精度误差问题

Math.floor()方法容易出现精度误差问题,例如:小数8.54保留两位小数。具体bug运行示例如下。

// 精度误差示例var num4 = Math.floor(8.54*100) / 100;console.log('实际值:8.54');console.log('Math.floor打印的值',num4);
edfe031cde25a6ed7bbc50d91c91aa67.png运行测试结果

a603b41e071b18bdd5537594810d49fc.png

ced52716b5ab5b3f30d639173f74ba00.gif ced52716b5ab5b3f30d639173f74ba00.gif ced52716b5ab5b3f30d639173f74ba00.gif

终极完美解决小数保留位数精度方案

先将数字(小数)转换为字符串,然后再进行截取,最后转回数字(小数),完美解决保留小数位数精度问题。

// 解决精度方案var num5 = 8.54342345;var numStr = num5.toString();var idx = numStr.indexOf('.');var res = Number(numStr.slice(0, idx + 3));console.log('res=',res);
edfe031cde25a6ed7bbc50d91c91aa67.png运行测试结果

14b3f5e10aaf0675fc8a971096303dd7.png

f88a1644b5c6a8df11d20db9d7f45714.png a8e51104ae7c68f0a60324e22e93dff9.pngEnd
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值