js小数运算出现多位小数如何解决


Posted in Javascript onOctober 08, 2015

和大家分享一个有趣的测试:

0.1+0.2 == 0.3 //false
顿时郁闷,好吧!原来0.1+0.2变成:0.30000000000000004
再来一个 2.4/0.8 =>2.9999999999999996 没办法换种方式,都转换成整数 (2.4 * 100)/(0.8 * 100)
10.22 现在要减去 0.11 结果值又出现了很多的小数 10.110000000000001,然后我就用了 toFixed 方法来过滤小数,但是不知道跟前面那种转换成整数后再执行哪种效率高,好!还是试下再说吧!

var date1 = new Date();
for(var i = 0; i < 10000; i++){
 var result1 = (10.22 - 0.11).toFixed(2);    
}
alert(new Date() - date1);//效率低
  
var date2 = new Date();
for(var j = 0; j < 10000; j++){
 var result2 = (10.22 * 1000 - 0.11 * 1000) / 1000;    
}
alert(new Date() - date2);//效率高
 
alert(0.1 + 0.2 == 0.3); //既然返回false
alert(0.1 + 0.2); //既然返回0.30000000000000004
alert(parseFloat(0.1) + parseFloat(0.2)); //还是返回0.30000000000000004

查了一些资料,一是 JavaScript 浮点数计算的 Bug,另一个是和计算机最终转换成二进制计算有关系,但是为什么不是所有小数都会有这种现象,目前我也不清楚,有时间再去深入研究一下。

解决方法:
解决这种问题两种方法,第一种就是利用JavaScript 的toFixed(n) 方法,直接获取N 位小数,不过,个人觉得这种方法在数据精度上会有一些问题。如果数据精度要求不高的话可以使用。

alert((0.1 + 0.2).toFixed(1));

第二种方法就是自己编写运算方法。以下是自定义加法函数,使用此方法进行相加会避免上面问题。

//自定义加法运算
function addNum (num1, num2) {
 var sq1,sq2,m;
 try {
  sq1 = num1.toString().split(".")[1].length;
 }
 catch (e) {
  sq1 = 0;
 }
 try {
  sq2 = num2.toString().split(".")[1].length;
 }
 catch (e) {
  sq2 = 0;
 }
 m = Math.pow(10,Math.max(sq1, sq2));
 return (num1 * m + num2 * m) / m;
}
alert(addNum(0.1, 0.2));

当然,简单一点也可以写成:alert((num * 3 + 10 * 3) /3); 这样也不会出现 N 多位小数。
alert((num * 3 + 10 * 3) /3); 与 alert(num + 10); 这两种写法计算机在底层转换成二进制运算是有区别的,或许这就是出现上述问题的原因,还有待我们去深入研究,大家可以多多讨论。

Javascript 相关文章推荐
javascript学习网址备忘
May 29 Javascript
基于jquery实现的定时显示与隐藏div广告的实现代码
Aug 22 Javascript
利用jquery动画特效和css打造的侧边弹出垂直导航
Apr 04 Javascript
angular.foreach 循环方法使用指南
Jan 06 Javascript
js绘制购物车抛物线动画
Nov 18 Javascript
纯JavaScript手写图片轮播代码
Oct 20 Javascript
js实现仿购物车加减效果
Mar 01 Javascript
使用layui 渲染table数据表格的实例代码
Aug 19 Javascript
vue+axios+promise实际开发用法详解
Oct 15 Javascript
小程序实现锚点滑动效果
Sep 23 Javascript
Angular单元测试之事件触发的实现
Jan 20 Javascript
JsonServer安装及启动过程图解
Feb 28 Javascript
jQuery实现仿微软首页感应鼠标变化滑动窗口效果
Oct 08 #Javascript
js实现超酷的照片墙展示效果图附源码下载
Oct 08 #Javascript
JS实现常见的TAB、弹出层效果(TAB标签,斑马线,遮罩层等)
Oct 08 #Javascript
Javascript控制div属性动态变化实例分析
Oct 08 #Javascript
JS+CSS实现的蓝色table选项卡效果
Oct 08 #Javascript
分享五个有用的jquery小技巧
Oct 08 #Javascript
用JavaScript判断CSS浏览器类型前缀的两种方法
Oct 08 #Javascript
You might like
php的计数器程序
2006/10/09 PHP
phpmyadmin导入(import)文件限制的解决办法
2009/12/11 PHP
老生常谈PHP面向对象之注册表模式
2017/05/26 PHP
ArrayList类(增强版)
2007/04/04 Javascript
Javascript 键盘keyCode键码值表
2009/12/24 Javascript
WEB高性能开发之疯狂的HTML压缩
2010/06/19 Javascript
jQuery hover 延时器实现代码
2011/03/12 Javascript
怎样在JavaScript里写一个swing把数据插入数据库
2012/12/10 Javascript
用示例说明filter()与find()的用法以及children()与find()的区别分析
2013/04/26 Javascript
快速掌握Node.js模块封装及使用
2016/03/21 Javascript
js禁止表单重复提交
2017/08/29 Javascript
JS获取日期的方法实例【昨天,今天,明天,前n天,后n天的日期】
2017/09/28 Javascript
vue解决弹出蒙层滑动穿透问题的方法
2018/09/22 Javascript
Vue源码解析之Template转化为AST的实现方法
2018/12/14 Javascript
elementUI多选框反选的实现代码
2019/04/03 Javascript
微信小程序--特定区域滚动到顶部时固定的方法
2019/04/28 Javascript
详解vue页面首次加载缓慢原因及解决方案
2019/11/06 Javascript
k8s node节点重新加入master集群的实现
2021/02/22 Javascript
[02:04]2014DOTA2国际邀请赛 BBC小组赛第三天总结
2014/07/12 DOTA
在Python中操作字符串之startswith()方法的使用
2015/05/20 Python
利用Python中SocketServer 实现客户端与服务器间非阻塞通信
2016/12/15 Python
Python实现多并发访问网站功能示例
2017/06/19 Python
浅谈Python处理PDF的方法
2017/11/10 Python
理论讲解python多进程并发编程
2018/02/09 Python
PIL对上传到Django的图片进行处理并保存的实例
2019/08/07 Python
Django 自定义分页器的实现代码
2019/11/24 Python
python如何安装下载后的模块
2020/07/03 Python
香港交友网站:be2香港
2018/07/22 全球购物
荣耀俄罗斯官网:HONOR俄罗斯
2020/10/31 全球购物
linux面试题参考答案(3)
2012/09/13 面试题
药学专业学生的自我评价分享
2014/02/06 职场文书
法定代表人授权委托书范文
2014/09/22 职场文书
领导走群众路线整改措施思想汇报
2014/10/12 职场文书
小学班主任事迹材料
2014/12/17 职场文书
颐和园导游词
2015/01/30 职场文书
运动会广播稿300字
2015/08/19 职场文书