Javascript 浮点运算的问题分析与解决方法


Posted in Javascript onAugust 27, 2013

十进制           二进制
0.1              0.0001 1001 1001 1001 ...
0.2              0.0011 0011 0011 0011 ...
0.3              0.0100 1100 1100 1100 ...
0.4              0.0110 0110 0110 0110 ...
0.5              0.1
0.6              0.1001 1001 1001 1001 ...
所以比如 1.1 ,其程序实际上无法真正的表示 ‘1.1',而只能做到一定程度上的准确,这是无法避免的精度丢失:

1.09999999999999999
在JavaScript中问题还要复杂些,这里只给一些在Chrome中测试数据:

 输入               输出
1.0-0.9 == 0.1     False
1.0-0.8 == 0.2     False
1.0-0.7 == 0.3     False
1.0-0.6 == 0.4     True
1.0-0.5 == 0.5     True
1.0-0.4 == 0.6     True
1.0-0.3 == 0.7     True
1.0-0.2 == 0.8     True
1.0-0.1 == 0.9     True
解决
那如何来避免这类 1.0-0.9 != 0.1 的非bug型问题发生呢?下面给出一种目前用的比较多的解决方案, 在判断浮点运算结果前对计算结果进行精度缩小,因为在精度缩小的过程总会自动四舍五入:

(1.0-0.9).toFixed(digits)                   // toFixed() 精度参数须在 0 与20 之间
parseFloat((1.0-0.9).toFixed(10)) === 0.1   // 结果为True
parseFloat((1.0-0.8).toFixed(10)) === 0.2   // 结果为True
parseFloat((1.0-0.7).toFixed(10)) === 0.3   // 结果为True
parseFloat((11.0-11.8).toFixed(10)) === -0.8   // 结果为True

方法提炼
// 通过isEqual工具方法判断数值是否相等
function isEqual(number1, number2, digits){
 digits = digits == undefined? 10: digits; // 默认精度为10
 return number1.toFixed(digits) === number2.toFixed(digits);
}
isEqual(1.0-0.7, 0.3);  // return true
// 原生扩展方式,更喜欢面向对象的风格
Number.prototype.isEqual = function(number, digits){
 digits = digits == undefined? 10: digits; // 默认精度为10
 return this.toFixed(digits) === number.toFixed(digits);
}
(1.0-0.7).isEqual(0.3); // return true
Javascript 相关文章推荐
GRID拖拽行的实例代码
Jul 18 Javascript
js 高效去除数组重复元素示例代码
Dec 19 Javascript
js制作简易年历完整实例
Jan 28 Javascript
javascript中JSON对象与JSON字符串相互转换实例
Jul 11 Javascript
js精美的幻灯片画集特效代码分享
Aug 29 Javascript
jquery实现全选功能效果的实现代码
May 05 Javascript
实例解析jQuery中proxy()函数的用法
May 24 Javascript
jQuery soColorPacker 网页拾色器
Jun 22 Javascript
iscroll动态加载数据完美解决方法
Jul 18 Javascript
jquery获取transform里的值实现方法
Dec 12 jQuery
layer插件select选中默认值的方法
Aug 14 Javascript
JavaScript创建表格的方法
Apr 13 Javascript
js中点击空白区域时文本框与隐藏层的显示与影藏问题
Aug 26 #Javascript
关于IE中getElementsByClassName不能用的问题解决方法
Aug 26 #Javascript
关于Jquery操作Cookie取值错误的解决方法
Aug 26 #Javascript
jquery弹出框的用法示例(2)
Aug 26 #Javascript
jquery弹出框的用法示例(一)
Aug 26 #Javascript
jQuery快速上手:写jQuery与直接写JS的区别详细解析
Aug 26 #Javascript
使用js实现雪花飘落效果
Aug 26 #Javascript
You might like
星际流派综述
2020/03/04 星际争霸
php URL跳转代码 减少外链
2011/06/25 PHP
PHP中使用GD库创建圆形饼图的例子
2014/11/19 PHP
浅谈php优化需要注意的地方
2014/11/27 PHP
微信公众平台DEMO(PHP)
2016/05/04 PHP
php fread读取文件注意事项
2016/09/24 PHP
QQ登录简单实现代码
2021/03/09 Javascript
浅谈JavaScript 的执行顺序
2015/08/07 Javascript
实用又漂亮的BootstrapValidator表单验证插件
2016/05/30 Javascript
微信小程序 教程之注册页面
2016/10/17 Javascript
react.js 翻页插件实例代码
2017/01/19 Javascript
详解angularjs中如何实现控制器和指令之间交互
2017/05/31 Javascript
vue之数据交互实例代码
2017/06/16 Javascript
js与jQuery实现的用户注册协议倒计时功能实例【三种方法】
2017/11/09 jQuery
微信小程序url传参写变量的方法
2018/08/09 Javascript
react 兄弟组件如何调用对方的方法示例
2018/10/23 Javascript
vue+canvas实现炫酷时钟效果的倒计时插件(已发布到npm的vue2插件,开箱即用)
2018/11/05 Javascript
Javascript执行流程细节原理解析
2020/05/14 Javascript
在vue中使用el-tab-pane v-show/v-if无效的解决
2020/08/03 Javascript
Python类装饰器实现方法详解
2018/12/21 Python
jupyter notebook 中输出pyecharts图实例
2020/04/23 Python
python 实现12bit灰度图像映射到8bit显示的方法
2019/07/08 Python
Python 多线程其他属性以及继承Thread类详解
2019/08/28 Python
int和Integer有什么区别
2013/05/25 面试题
护士实习自我鉴定
2013/10/22 职场文书
门卫岗位职责
2013/11/15 职场文书
商场消防管理制度
2014/01/12 职场文书
二年级小学生评语
2014/04/21 职场文书
村级换届选举方案
2014/05/10 职场文书
求职信的正确写法
2014/07/10 职场文书
总账会计岗位职责
2015/04/02 职场文书
2015年幼儿园德育工作总结
2015/05/25 职场文书
2019 入党申请书范文
2019/07/10 职场文书
利用python调用摄像头的实例分析
2021/06/07 Python
JavaScript函数柯里化
2021/11/07 Javascript
开发微信小程序之WXSS样式教程
2022/04/18 HTML / CSS