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

 更新时间:2015年10月08日 10:39:50   投稿:lijiao  
关于JavaScript小数进行加、减、乘、除出现多位小数问题,自己研究了一下,而且作了相关的测试,收获不少知识点,需要的朋友可以参考下

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

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); 这两种写法计算机在底层转换成二进制运算是有区别的,或许这就是出现上述问题的原因,还有待我们去深入研究,大家可以多多讨论。

相关文章

  • 微信小程序 websocket 实现SpringMVC+Spring+Mybatis

    微信小程序 websocket 实现SpringMVC+Spring+Mybatis

    这篇文章主要介绍了 微信小程序websocket实现SpringMVC+Spring+Mybatis的相关资料,这里提供实现思路及实现代码,需要的朋友可以参考下
    2017-08-08
  • uniapp自定义网络检测组件项目实战总结分析

    uniapp自定义网络检测组件项目实战总结分析

    这篇文章主要为大家介绍了uniapp自定义网络检测组件项目实战总结分析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-09-09
  • JavaScript 消息框效果【实现代码】

    JavaScript 消息框效果【实现代码】

    下面小编就为大家带来一篇JavaScript 消息框效果【实现代码】。小编觉得挺不错的,现在分享给大家,也给大家做个参考
    2016-04-04
  • js中常用的4种模糊查询详解(includes()、indexOf()、search()、match())

    js中常用的4种模糊查询详解(includes()、indexOf()、search()、match())

    这篇文章主要给大家介绍了关于js中常用的4种模糊查询(includes()、indexOf()、search()、match())的相关资料,搜索可以使我们更快的找到某一个关键词或者某一个商品,所以模糊查询和下拉匹配也成了前端必备的一个小技能,需要的朋友可以参考下
    2023-11-11
  • js中split()方法得到的数组长度问题

    js中split()方法得到的数组长度问题

    split() 方法用于把一个字符串分割成字符串数组。这篇文章给大家介绍js中split()方法得到的数组长度问题,感兴趣的朋友一起看看吧
    2018-07-07
  • Javascript中的数组常用方法解析

    Javascript中的数组常用方法解析

    这篇文章主要介绍了Javascript中的数组常用方法解析的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-06-06
  • 微信公众号网页分享功能开发的示例代码

    微信公众号网页分享功能开发的示例代码

    这篇文章主要介绍了微信公众号网页分享功能开发的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-05-05
  • JavaScript如何实现在文本框(密码框)输入提示语

    JavaScript如何实现在文本框(密码框)输入提示语

    为了更好的达到用户体验度,我们在登录表单时会有一些提示语言,比如说:“请输入用户名”和“请输入密码”等语言,下面小编通过本篇文章给大家分享JavaScript如何实现在密码框中出现提示语,对js密码框提示语相关知识感兴趣的朋友一起学习吧
    2015-12-12
  • JavaScript几种形式的树结构菜单

    JavaScript几种形式的树结构菜单

    今天我主要讲3种不同展示的JavaScript树结构菜单,分别是悬浮层树(Tree)、右键菜单树(ContextMenu)和节点树(TreeMenu),目前都支持无限级层次。
    2010-05-05
  • js中匿名函数的创建与调用方法分析

    js中匿名函数的创建与调用方法分析

    这篇文章主要介绍了js中匿名函数的创建与调用方法,详细分析了匿名函数的原理与用法,以及闭包的原理分析,非常具有实用价值,需要的朋友可以参考下
    2014-12-12

最新评论