精度问题
大家一定遇到过这种问题:
console.log(0.1 + 0.2);//0.30000000000000004
console.log(2.22 + 0.1);// 2.3200000000000003
console.log(1.0 - 0.9);//0.09999999999999998
console.log(19.9 * 100);//1989.9999999999998
console.log(6.6 / 0.2);//32.99999999999999
这真是一个令人黯然蛋碎的bug,而且即使在es6时代依然没能解决,怎么办呢?只能靠自己了。
为什么出现这个问题呢?
我们生活中用到的十进制计算,在计算机底层都会将其转为二进制运算。我们把0.1转为二进制,其实是:
0.1 => 0.0001 1001 1001 1001…(无限循环)
这就是浮点型数值计算不准确的原因。
解决方案
既然浮点型直接计算会出问题,那么我们就换种思路,可以将其先转为整型计算,然后再转回去。
比如0.1+0.2,我们完全可以先都扩大10倍,相加得3,然后除以10,不就得到0.3这个准确数值了么?
根据这个思路,我们写出如下代码:
(function (Number) {
//加法
Number.prototype.add = function (arg) {
var r1, r2, m;
try {
r1 = this.toString().split(".")[1].length // 小数的位数
} catch (e) {
r1 = 0
}
try {
r2 = arg.toString().split(".")[1].length // 小数的位数
} catch (e) {
r2 = 0
}
m = Math.pow(10, Math.max(r1, r2)) // 按小数位多的那个扩大倍数
var a = this * m
var b = arg * m
return (a + b) / m
}
})(Number)
代码很简单我们不做过多解释,直接看结果吧:
console.log(0.1 + 0.2) // 0.30000000000000004
console.log((0.1).add(0.2)) // 0.3
ok,貌似大功告成哈?别着急,咱们再看个例子:
console.log(2.22 + 0.1) // 2.3200000000000003
console.log((2.22).add(0.1)) // 2.3200000000000003
卧槽?神马情况这是?不科学啊~~
其实我们忽略了一个重要问题,那就是——浮点乘法也会有精度问题!!
console.log(2.22*100) //222.00000000000003
console.log(19.9 * 100);//1989.9999999999998
愁人不?太愁人了!!咋办呢?
别急,有办法。
我们的目标,就是要保证扩大倍数后得到的整数一定要准确,我们是否可以通过parseInt函数,对乘法结果直接取整呢?
如果是2.22x100,parseInt取整得到222,这是准确的;然鹅,19.9x100,取整就是1989,正确的结果应该是1990,这就不对了。
怎么就能让它对呢?
咱们可以这样:
将乘法得到的数值,再加个0.5,然后再取整,以保障整数的准确。
为啥要加0.5呢?
答案是:0.5会保证四舍五入。
console.log(2.22*100+0.5) //222.50000000000003
console.log(19.9 * 100+0.5);//1990.4999999999998
这样一来,parseInt取整不就对了么。
好的,我们将之前的代码做一下修正:
Number.prototype.add = function (arg) {
var r1, r2, m;
try {
r1 = this.toString().split(".")[1].length
} catch (e) {
r1 = 0
}
try {
r2 = arg.toString().split(".")[1].length
} catch (e) {
r2 = 0
}
m = Math.pow(10, Math.max(r1, r2)) // 取位数最大的那个
var a = parseInt(this * m + 0.5)
var b = parseInt(arg * m + 0.5)
return (a + b) / m
}
然后再看看结果:
console.log(0.1 + 0.2);//0.30000000000000004
console.log(2.22 + 0.1);// 2.3200000000000003
console.log((0.1).add(0.2)) // 0.3
console.log((2.22).add(0.1)) // 2.32
好,下面我们继续把减法、乘法和除法都补全。
减法其实很简单,加一个负数不就是减法了嘛~~
Number.prototype.sub = function (arg) {
return this.add(-arg);
}
然后是乘法。
乘法思路也很简单,比如3.15x7.2,其实可以这么计算:
(315x72)/1000
对吧?
也就是说,我们可以先去掉他们的小数点,先转为整数乘法,然后再将结果缩小n倍。
于是我们写出如下代码:
Number.prototype.mul = function (arg) {
var m = 0, s1 = this.toString(), s2 = arg.toString();
try {
m += s1.split('.')[1].length
} catch (e) {
}
try {
m += s2.split('.')[1].length // m是累加结果
} catch (e) {
}
return Number(s1.replace('.', '')) * Number(s2.replace('.', '')) / Math.pow(10, m) // 直接去掉小数点,转为整型计算,最后缩小n倍
}
最后是除法。
我们举个例子,比如:1.5/0.21,还记得小学除法老师是怎么教的来着?
是不是把分子分母同时都扩大n倍,然后相除呢?也就是:150/21
但我们前面说过,浮点型直接扩大整数倍,也会产生精度问题,这个问题要注意。
好,顺着这个思路,我们可以轻松写出代码:
Number.prototype.div = function (arg) {
var r1, r2, m;
try {
r1 = this.toString().split(".")[1].length
} catch (e) {
r1 = 0
}
try {
r2 = arg.toString().split(".")[1].length
} catch (e) {
r2 = 0
}
m = Math.pow(10, Math.max(r1, r2))
var a = parseInt(this * m + 0.5)
var b = parseInt(arg * m + 0.5)
return a/b
}
完整代码
(function (Number) {
//加法
Number.prototype.add = function (arg) {
var r1, r2, m;
try {
r1 = this.toString().split(".")[1].length
} catch (e) {
r1 = 0
}
try {
r2 = arg.toString().split(".")[1].length
} catch (e) {
r2 = 0
}
m = Math.pow(10, Math.max(r1, r2))
var a = parseInt(this * m + 0.5)
var b = parseInt(arg * m + 0.5)
return (a + b) / m
}
//减法
Number.prototype.sub = function (arg) {
return this.add(-arg);
}
//乘法
Number.prototype.mul = function (arg) {
var m = 0, s1 = this.toString(), s2 = arg.toString();
try {
m += s1.split('.')[1].length
} catch (e) {
}
try {
m += s2.split('.')[1].length // m是累加结果
} catch (e) {
}
return Number(s1.replace('.', '')) * Number(s2.replace('.', '')) / Math.pow(10, m)
}
//除法
Number.prototype.div = function (arg) {
var r1, r2, m;
try {
r1 = this.toString().split(".")[1].length
} catch (e) {
r1 = 0
}
try {
r2 = arg.toString().split(".")[1].length
} catch (e) {
r2 = 0
}
m = Math.pow(10, Math.max(r1, r2))
var a = parseInt(this * m + 0.5)
var b = parseInt(arg * m + 0.5)
return a/b
}
})(Number)