JavaScript之解决数值精度丢失、indexOf、split、toString、replace、npm install mj-calculation --save

1、案例

console.log(0.1 + 0.1); // 0.2 console.log(0.1 + 0.2); // 0.30000000000000004 console.log(1.2 - 1); // 0.19999999999999996 

在JavaScript中加减法都会导致精度丢失。这不是JavaScript独特的现象，在其他语言中也存在类似现象，比如在Python中执行print(0.1 + 0.2)的结果也是0.30000000000000004。

2、原因

JavaScript内部只有一种数字类型Number，也就是说JavaScript语言的底层根本没有整数，所有数字都是以IEEE-754标准格式64位浮点数形式储存，1与1.0是相同的。因为有些小数以二进制表示位数是无穷的。JavaScript会把超出53位之后的二进制舍弃，所以涉及小数的比较或运算时容易精度丢失。

浮点数的运算过程

首先，十进制的0.1和0.2会转换成二进制，但是由于浮点数用二进制表示是无穷的。

0.1 ——> 0.0001 1001 1001 1001 ...(1001循环) 0.2 ——> 0.0011 0011 0011 0011 ...(0011循环) 

IEEE754标准的64位双精度浮点数的小数部分最多支持53位二进制，多余的二进制数字被截断，所以两者相加之后的二进制之和如下。

0.0100110011001100110011001100110011001100110011001101 

将截断之后的二进制数字再转换为十进制，就成了0.30000000000000004，所以在计算时产生了误差。

3、解决方案 3.1、推荐使用第三方库

1、mathjs 2、decimal 3、big 4、bignumber

3.2、个人封装的库，可供学习与使用

下载/安装命令

npm install mj-calculation --save

cnpm install mj-calculation --save

使用说明会在安装包的.md文件中标注。

关键代码

function handleValue(numb1 = 0, numb2 = 0, type) { if (type === 'addition' || type === 'subtraction') { let numLen1 = 0, numLen2 = 0, maxLen; if (numb1.indexOf('.') !== -1) numLen1 = (numb1.split('.')[1]).length; if (numb2.indexOf('.') !== -1) numLen2 = (numb2.split('.')[1]).length; maxLen = Math.pow(10, Math.max(numLen1, numLen2)); return maxLen; } else if (type === 'multiplication') { let maxLen = 0; if (numb1.indexOf('.') !== -1) maxLen += (numb1.split('.')[1]).length; if (numb2.indexOf('.') !== -1) maxLen += (numb2.split('.')[1]).length; return maxLen; } else if (type === 'division') { let numLen1 = 0, numLen2 = 0, number1, number2; if (numb1.indexOf('.') !== -1) (numLen1 = (numb1.split('.')[1]).length, number1 = numb1.toString().replace(".", "")); if (numb2.indexOf('.') !== -1) (numLen2 = (numb2.split('.')[1]).length, number2 = numb2.toString().replace(".", "")); return { numLen1, numLen2, number1, number2 }; } }