js中进行数字计算时候,会出现精度误差的问题。先来看一个实例:

console.log(0.1+0.2===0.3);//false

console.log(0.1+0.1===0.2);//true

上面第一个的输出会超出我们的常识,正常应该为true,这里为什么会是false呢,直接运行会发现0.1+0.2在js中计算的结果是:

console.log(0.1+0.2);//输出0.30000000000000004

这对于浮点数的四则运算(加减乘除),几乎所有的编程语言都会出现上面类似的精度误差问题,只是大部分语言都处理封装了避免误差的方法。对于js而言,由于它是一门弱类型的语言,所以并没有对浮点数的运算有解决的封装方法,这能我们自己来解决。这里为什么会出现这个精度误差呢?

浮点数产生的原因 

我们首先就想到计算机能读懂的是二进制,所以我们进行运算的时候,实际上是把数字转换为了二进制进行的,所以我们把0.1和0.2转换为二进制:

0.1 => 0.0001 1001 1001 1001..(无限循环)

0.2 => 0.0011 0011 0011 0011…(无限循环)

这里可以看出转换为二进制是一个无限循环的数字,单在计算机中对于无限循环的数字会进行舍入处理的,进行双精度浮点数的小数部分最多支持52位。然后把两个2进制的数进行运算得出的也是一个二进制数值,最后再把它转换为十进制。保留17位小数,所以0.1+0.2的值就成了 0.30000000000000004。  0.1+0.1的值成了0.20000000000000000,全是0的时候可以省略,就成了0.2

解决浮点数精度误差的办法

最简单的处理,通过toFixed方法,

console.log(parseFloat(0.1+0.2).toFixed(1));//输出0.3

说明:通过toFixed(num)方法来保留小数,其中num为保留小数的位数,这个方法是根据四舍五入来保留小数的,所以计算的结果并不是最精确的。所以我们需要采用其它方法来实现,通过Number.prototype的属性进行添加,如下:

js加法:

//加法函数

function accAdd(arg1, arg2) {

var r1, r2, m;

try {

r1 = arg1.toString().split(".")[1].length;

} catch(e) {

r1 = 0;

}

try {

r2 = arg2.toString().split(".")[1].length;

}catch(e){

r2 = 0;

}

m = Math.pow(10, Math.max(r1, r2));

return(arg1 * m + arg2 * m) / m;

} //给Number类型增加一个add方法,使用时直接用 .add 即可完成计算。

Number.prototype.add = function(arg){

return accAdd(arg, this);

};

console.log(0.1.add(0.2).add(0.3));//等价于0.1+0.2+0.3,输出0.6

console.log(0.1+0.2+0.3);//输出0.6000000000000001

js减法:

//减法函数

function Subtr(arg1, arg2) {

var r1, r2, m, n;

try {

r1 = arg1.toString().split(".")[1].length;

} catch(e) {

r1 = 0;

}

try {

r2 = arg2.toString().split(".")[1].length;

} catch(e) {

r2 = 0;

}

m = Math.pow(10, Math.max(r1, r2)); //动态控制精度长度

n = (r1 >= r2) ? r1 : r2;

return parseFloat(((arg1 * m - arg2 * m) / m).toFixed(n));

}

Number.prototype.sub = function(arg) {

return Subtr(this, arg);

};

console.log(0.6.sub(0.2).sub(0.3));//等价于0.6-0.2-0.3 输出0.1

console.log(0.6-0.2-0.3);//输出:0.09999999999999998

js乘法:

//乘法函数

function accMul(arg1, arg2) {

var m = 0,

s1 = arg1.toString(),

s2 = arg2.toString();

try {

m += s1.split(".")[1].length;

} catch(e) {}

try {

m += s2.split(".")[1].length;

} catch(e) {}

return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m);

}

Number.prototype.mul = function (arg) {

return accMul(arg, this);

};

console.log(0.1.mul(0.2).mul(0.3)); //等价于0.1 * 0.2 * 0.3 输出0.006

console.log(0.1 * 0.2 * 0.3); //输出:0.006000000000000001

js除法:

//除法函数

function accDiv(arg1, arg2) {

var t1 = 0,

t2 = 0,

r1, r2;

try {

t1 = arg1.toString().split(".")[1].length;

} catch(e) {}

try {

t2 = arg2.toString().split(".")[1].length;

} catch(e) {}

with(Math) {

r1 = Number(arg1.toString().replace(".", ""));

r2 = Number(arg2.toString().replace(".", ""));

return(r1 / r2) * pow(10, t2 - t1);

}

}

Number.prototype.div = function (arg) {

return accDiv(this, arg);

};

console.log(0.6.div(0.2).div(0.1)); //等价于0.6 / 0.2 / 0.1 输出30

console.log(0.6 / 0.2 / 0.1); //输出:29.999999999999993

js浮点数精度丢失问题及如何解决js中浮点数计算不精准的更多相关文章

  1. Java 浮点数精度丢失

    Java 浮点数精度丢失 问题引入 昨天帮室友写一个模拟发红包抢红包的程序时,对金额统一使用的 double 来建模,结果发现在实际运行时程序的结果在数值上总是有细微的误差,程序运行的截图: 输入依次 ...

  2. 计算价格, java中浮点数精度丢失的解决方案

    计算价格, java中浮点数精度丢失的解决方案

  3. javascript(js)小数精度丢失的解决方案

    原因:js按照2进制来处理小数的加减乘除,在arg1的基础上 将arg2的精度进行扩展或逆扩展匹配,所以会出现如下情况. javascript(js)的小数点加减乘除问题,是一个js的bug如0.3* ...

  4. js数字精度丢失

    http://www.cnblogs.com/snandy/p/4943138.html

  5. JavaScript数字精度丢失问题总结

    本文分为三个部分 JS 数字精度丢失的一些典型问题 JS 数字精度丢失的原因 解决方案(一个对象+一个函数) 一.JS数字精度丢失的一些典型问题 1. 两个简单的浮点数相加 0.1 + 0.2 != ...

  6. JavaScript数字精度丢失的一些问题

    本文分为三个部分 JS 数字精度丢失的一些典型问题 JS 数字精度丢失的原因 解决方案(一个对象+一个函数) 一.JS数字精度丢失的一些典型问题 1. 两个简单的浮点数相加 1 0.1 + 0.2 ! ...

  7. 学以致用:手把手教你撸一个工具库并打包发布,顺便解决JS浮点数计算精度问题

    本文讲解的是怎么实现一个工具库并打包发布到npm给大家使用.本文实现的工具是一个分数计算器,大家考虑如下情况: \[ \sqrt{(((\frac{1}{3}+3.5)*\frac{2}{9}-\fr ...

  8. 后端传Long类型至前端js会出现精度丢失问题

    今天开发遇到个问题,Java后端的Long类型数据,传到前端会出现精度丢失,如:164379764419858435,前端会变成164379764419858430.在浏览器中做测试可知,这就是一个精 ...

  9. JavaScript数字计算精度丢失的问题和解决方案

    一.JS数字精度丢失的一些典型问题 1. 两个简单的浮点数相加:0.1 + 0.2 != 0.3 // true,下图是firebug的控制台截图: 看看java的计算结果:是不是让你很不能接受 再来 ...

随机推荐

  1. WC2018 文艺汇演《退役的你》

    视频网址:https://www.bilibili.com/video/av19333297 谨以此歌献给那些曾与我们并肩前行的退役 OIer 填词 & 视频:Menci 演唱:wxh0109 ...

  2. Django---路由系统,URLconf的配置,正则表达式的说明(位置参数),分组命名(捕获关键字参数),传递额外的参数给视图,命名url和url的反向解析,url名称空间

    Django---路由系统,URLconf的配置,正则表达式的说明(位置参数),分组命名(捕获关键字参数),传递额外的参数给视图,命名url和url的反向解析,url名称空间 一丶URLconf配置 ...

  3. mmap vs read

    先放个结论: 内存映射通常比随机访问更快,尤其访问的对象是分离的和不可预测的. 内存映射会持续占用pages, 直到完成访问. 这意味当长时间重度使用一个文件很久之前, 然后你关闭了它, 然后再重新打 ...

  4. 【转】Webpack 快速上手(中)

    由于文章篇幅较长,为了更好的阅读体验,本文分为上.中.下三篇: 上篇介绍了什么是 webpack,为什么需要 webpack,webpack 的文件输入和输出 中篇介绍了 webpack 在输入和输出 ...

  5. jQuery(三)之 选择器(基础版)

    对于jQuery的调用,我们一般都会传入参数 html: <div></div> js: console.log($('<a />')); console.log( ...

  6. 量化金融策略开源框架:QUANTAXIS

    简介: QUANTAXIS量化金融策略框架,是一个面向中小型策略团队的量化分析解决方案,是一个从数据爬取.清洗存储.分析回测.可视化.交易复盘的本地一站式解决方案. QUANTAXIS量化金融策略框架 ...

  7. elasticsearch 连接查询 基于es5.1.1

    ElasticSerch 的连接查询有两种方式实现 nested parent和child关联查询 nested 存储结构 nested的方式和其他字段一样,在同一个type里面存储,以数组的方式存储 ...

  8. 【Spring Boot】Spring Boot之利用Logstash将日志转换成以JSON的格式存储和输出

    一.Logstash的作用 Logstash是一个完全开源的工具,它可以对日志进行收集.过滤,能非常方便地将日志转换成以JSON的格式存储和输出,并将其存储供以后使用. 二.整合Logstash的步骤 ...

  9. spark操作总结

    一.sparkContext与sparkSession区别 任何Spark程序都是SparkContext开始的,SparkContext的初始化需要一个SparkConf对象,SparkConf包含 ...

  10. 如何将VOC XML文件转化成COCO数据格式

    数据转换实在是个烦人的工作,被折磨了很久决定抽出时间整理一下,仅供参考. 在一个项目中,我需要将已有的VOC的xml标注文件转化成COCO的数据格式,为了方便理解,文章按如下顺序介绍: XML文件内容 ...