JS精度丢失问题

最近开发的项目新需求中，须要一个金额的输入框，其输入上限为16位整数带两位小数的浮点类型，因为前台显示的金额是字符串型，在传递给后台时使用了parseFloat()方法，却发如今测试校验最大临界值时，发生了四舍五入，最终致使校验失败，由此引起了我对JS浮点数表示和运算了深刻理解。

JS浮点数精度丢失的缘由

因为计算机的二进制实现和位数限制，有些数没法有限表示。就像一些无理数不能有限表示，如 圆周率 3.1415926...，1.3333... 等。JS 遵循 IEEE 754 规范，采用双精度存储（double precision），占用 64 bit。

• 1位用来表示符号位
• 11位用来表示指数
• 52位表示尾数

由于在计算机最底层，数值的运算和操做都是采用二进制实现的，因此计算机没有办法精确表示浮点数，而只能用二进制近似相等的去表示浮点数的小数部分。

0.1 >> 0.0001 1001 1001 1001…（1001无限循环）
0.2 >> 0.0011 0011 0011 0011…（0011无限循环）
复制代码

当进行计算或其余操做时时，四舍五入（逢1进，逢0舍）将会致使最终的运算结果存在误差。

而大整数也存在一样的问题，由于表示尾数的尾数只有52位，所以 JS 中能精准表示的最大整数是 Math.pow(2, 53)，即十进制9007199254740992。

9007199254740992     >> 10000000000000...000 // 共计 53 个 0
9007199254740992 + 1 >> 10000000000000...001 // 中间 52 个 0
9007199254740992 + 2 >> 10000000000000...010 // 中间 51 个 0
9007199254740992 + 1 // 丢失        //9007199254740992 
9007199254740992 + 2 // 未丢失      //9007199254740994   
9007199254740992 + 3 // 丢失        //9007199254740992 
9007199254740992 + 4 // 未丢失      //9007199254740996  
复制代码

由此可知，十进制中的有穷数值，在计算机底层，多是0、1循环的无限数值。

在Java、C、C++中，均有对浮点数值的特殊处理，如Java的BigDecimal类型就是用来解决这一浮点数问题。

常见的出错场合

浮点数计算、比较：

0.1 + 0.2 != 0.3 // true
复制代码

大整数计算、比较：

普通的整数计算比较不太容易出错，除非计算范围超出 Math.pow(2, 53)

9999999999999999 == 10000000000000001 // true
复制代码

多位数字符数值转换：

这种状况在一些金额的计算中较容易出现，但也是最容易被忽视的一种，当用户在输入框中输入一个位数较多的字符串（不单单包含大数值，小数点后位数过长也包含在这一案例中），并在前台使用JS将其转换为数值，获得的结果每每是四舍五入带有误差的值

parseFloat(0.9);    //0.9
parseFloat(9999999999999999.9)    //10000000000000000
parseInt("9999999999999999");    //10000000000000000
parseFloat(9.999999999999999);   //10
复制代码

toFixed不会四舍五入：

var num = 1.335;
num.toFixed(2);   //1.33
复制代码

解决方案

浮点数计算、比较：

一般解决这一问题，采用的都是将浮点部分转换成整数后进行计算

//浮点数转换为整数
function toInt(num){
    var rel = {};
    var str,pos,len,times;
    str = (num < 0) ? -num + '' : num + ''; 
    pos = str.indexOf('.');
    len = str.substr(pos+1).length;
    times = Math.pow(10, len);
    rel.times = times;
    rel.num =  num;
    return rel;
}

//计算过程
function operate(a,b,op){
    var d1 = toInt(a);
    var d2 = toInt(b);
    var max = d1.times > d2.times ? d1.times : d2.times;
    var rel;
    switch(op){
        case "+" :
            rel = (d1.num * max + d2.num * max) / max;
            break;
        case "-" :
            rel = (d1.num * max - d2.num * max) / max;
            break;
        case "*" :
            rel = ((d1.num * max) * (d2.num * max)) / (max * max);
            break;
        case "/" :
            rel = (d1.num * max) / (d2.num * max);
            break;
    }
    return rel;
}

var rel = operate(0.3,0.1,"+");   //0.4
复制代码

多位数数值转换：

前台不对这类字符串进行数值转换，传到后台后，由后台进行处理

toFix的修复：

function toFixed(num, s) {
    var times = Math.pow(10, s)
    var des = num * times + 0.5
    des = parseInt(des, 10) / times
    return des + ''
}
复制代码