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 相关文章推荐
Input 特殊事件onpopertychange和oninput
Jun 17 Javascript
js实现touch移动触屏滑动事件
Apr 17 Javascript
javascript中的altKey 和 Event属性大全
Nov 06 Javascript
Javascript模仿淘宝信用评价实例(附源码)
Nov 26 Javascript
通过点击jqgrid表格弹出需要的表格数据
Dec 02 Javascript
使用angularjs创建简单表格
Jan 21 Javascript
BootStrap智能表单实战系列(十一)级联下拉的支持
Jun 13 Javascript
JS 终止执行的实现方法
Nov 24 Javascript
如何提高数据访问速度
Dec 26 Javascript
JavaScript实现弹窗效果代码分析
Mar 09 Javascript
使用JS实现图片轮播的实例(前后首尾相接)
Sep 21 Javascript
Layui实现数据表格中鼠标悬浮图片放大效果,离开时恢复原图的方法
Sep 11 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实现加密的几种方式介绍
2015/02/22 PHP
Yii遍历行下每列数据的方法
2016/10/17 PHP
php DES加密算法实例分析
2019/09/18 PHP
短信提示使用 特效
2007/01/19 Javascript
AJAX架构之Dojo篇
2007/04/10 Javascript
js 创建书签小工具之理论
2011/02/25 Javascript
使用JavaScript动态设置样式实现代码(2)
2013/01/25 Javascript
jQuery使用一个按钮控制图片的伸缩实现思路
2013/04/19 Javascript
客户端js判断文件类型和文件大小即限制上传大小
2013/11/20 Javascript
Node.js中使用Buffer编码、解码二进制数据详解
2014/08/16 Javascript
JavaScript计划任务后台运行的方法
2015/12/18 Javascript
JavaScript控制浏览器全屏及各种浏览器全屏模式的方法、属性和事件
2015/12/20 Javascript
Bootstrap入门书籍之(一)排版
2016/02/17 Javascript
jQuery表单对象属性过滤选择器实例详解
2016/09/13 Javascript
jQuery代码实现实时获取时间
2017/01/29 Javascript
通过jquery的ajax请求本地的json文件方法
2018/08/08 jQuery
三种Webpack打包方式(小结)
2018/09/19 Javascript
微信小程序跨页面数据传递事件响应实现过程解析
2019/12/19 Javascript
JS实现鼠标按下拖拽效果
2020/07/23 Javascript
前端 javascript 实现文件下载的示例
2020/11/24 Javascript
python列出目录下指定文件与子目录的方法
2015/07/03 Python
python是否适合网页编程详解
2019/10/04 Python
使用TensorFlow直接获取处理MNIST数据方式
2020/02/10 Python
解决python执行较大excel文件openpyxl慢问题
2020/05/15 Python
python脚本定时发送邮件
2020/12/22 Python
pycharm远程连接服务器并配置python interpreter的方法
2020/12/23 Python
Python用户自定义异常的实现
2020/12/25 Python
美国孩之宝玩具官网:Hasbro Pulse
2019/06/24 全球购物
Ibatis中如何提高SQL Map的性能
2013/05/11 面试题
怎么处理XML的中文问题
2015/03/26 面试题
办公室前台岗位职责范本
2013/12/10 职场文书
小学生倡议书范文
2014/05/13 职场文书
分公司负责人任命书
2014/06/04 职场文书
红头文件任命书范本
2014/06/05 职场文书
高中学生自我评价范文
2014/09/23 职场文书
2015年三万活动总结
2015/03/25 职场文书