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 相关文章推荐
深入理解javascript的执行顺序
Apr 04 Javascript
JavaScript让Textarea支持tab按键的方法
Jun 26 Javascript
基于Arcgis for javascript实现百度地图ABCD marker的效果
Sep 12 Javascript
jquery按回车键实现表单提交的简单实例
May 25 Javascript
基于jQuery和hwSlider实现内容左右滑动切换效果附源码下载(一)
Jun 22 Javascript
使用JQuery选择HTML遍历函数的方法
Sep 17 Javascript
基于slideout.js实现移动端侧边栏滑动特效
Nov 28 Javascript
微信小程序 开发之滑块视图容器(swiper)详解及实例代码
Feb 22 Javascript
React Native之prop-types进行属性确认详解
Dec 19 Javascript
详解vue的数据劫持以及操作数组的坑
Apr 18 Javascript
关于vue项目中搜索节流的实现代码
Sep 17 Javascript
JavaScript十大取整方法实例教程
Dec 03 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
thinkPHP5.0框架简单配置作用域的方法
2017/03/17 PHP
Js组件的一些写法
2010/09/10 Javascript
学习JavaScript正则表达式
2015/11/13 Javascript
JavaScript类型系统之正则表达式
2016/01/05 Javascript
JavaScript中的Number数字类型学习笔记
2016/05/26 Javascript
JS不用正则验证输入的字符串是否为空(包含空格)的实现代码
2016/06/14 Javascript
微信小程序链接传参并跳转新页面
2016/11/29 Javascript
BootStrap+Mybatis框架下实现表单提交数据重复验证
2017/03/23 Javascript
JS 组件系列之Bootstrap Table的冻结列功能彻底解决高度问题
2017/06/30 Javascript
Javascript实现找不同色块的游戏
2017/07/17 Javascript
荐书|您有一份JavaScript书单待签收
2017/07/21 Javascript
vue-swiper的使用教程
2018/08/30 Javascript
vue+node实现图片上传及预览的示例方法
2018/11/22 Javascript
Vue项目实现简单的权限控制管理功能
2019/07/17 Javascript
js+springMVC 提交数组数据到后台的实例
2019/09/21 Javascript
Vue中 axios delete请求参数操作
2020/08/25 Javascript
[17:45]DOTA2 HEROES教学视频教你分分钟做大人-军团指挥官
2014/06/11 DOTA
[01:33]PWL开团时刻DAY2-开雾与反开雾
2020/10/31 DOTA
Python2.x中文乱码问题解决方法
2015/06/02 Python
Python利用Beautiful Soup模块创建对象详解
2017/03/27 Python
通过python将大量文件按修改时间分类的方法
2018/10/17 Python
python 实现交换两个列表元素的位置示例
2019/06/26 Python
python挖矿算力测试程序详解
2019/07/03 Python
Pytorch根据layers的name冻结训练方式
2020/01/06 Python
python名片管理系统开发
2020/06/18 Python
python安装mysql的依赖包mysql-python操作
2021/01/01 Python
使用CSS3美化HTML表单的技巧演示
2016/05/17 HTML / CSS
一文彻底解决HTML5页面中长按保存图片功能
2019/06/10 HTML / CSS
受外贸欢迎的美国主机:BlueHost
2017/05/16 全球购物
李宁官方网店:中国运动品牌
2017/11/02 全球购物
机电一体化专业应届本科生求职信
2013/09/27 职场文书
小学生检讨书大全
2014/02/06 职场文书
乡村文明行动实施方案
2014/03/29 职场文书
入党积极分子党支部意见
2015/06/02 职场文书
Vue+TypeScript中处理computed方式
2022/04/02 Vue.js
golang操作redis的客户端包有多个比如redigo、go-redis
2022/04/14 Golang