JavaScript精度丢失问题

JavaScript精度丢失问题。

• javaScript中臭名昭著的BUG就是0.1+0.2 !== 0.3，因为精度问题，导致所有浮点数运算都是不安全的。

• 正如下面的计算结果，它们并不是我们所预想的：

0.1 + 0.2 = 0.30000000000000004

1 - 0.9 = 0.09999999999999998

• 虽然很多人知道这个浮点数误差这个问题的，可是却不知道背后的原理以及解决方案。今天我们就通过上面两个例子看看JavaScript浮点数误差问题背后的原理以及解决方案吧！

• 那我们先来看看本文将包含什么内容

1. 为什么JavaScript的所有数值都统称为Number
2. 是什么导致的浮点数计算误差问题（IEEE 754是什么）
3. 那遇到浮点数计算应该如何解决
4. 最后讲讲JavaScript值的范围

为什么JavaScript中所有的数值类型都称为Number类型

我们通过ECMAScript看看。

在ECMAScript标准中我们可以看到对Number类型的定义是这样的，使用IEEE 754格式表示整数和浮点值(JavaScript使用的是64位，也就是常说的'双精度')。

那为什么呢？因为存储浮点值是存储整数值的两倍，因此ECMAScript总是想方设法把把值转换位整数。这样的存储结构优点是可以归一化处理整数和小数，节省存储空间。

什么导致浮点数计算的误差问题？IEEE 754是什么？

• 因为JavaScript中是遵循IEEE 754的标准，在程序的内部Number类型实质是一个64位固定长度的浮点数，也就是标准的double双精度浮点数。

• IEEE 754 是IEEE二进制浮点数算数标准。格式如下

V = (-1)^s （1+M） 2^(E-127)（单精度）

V = (-1)^s （1+M） 2^(E-1023)（双精度）

• 那我们来看看十进制的数值是如何按照IEEE 754进行转换的

• 十进制小数 3.14转换二进制 3.14 = 11.001000111101011100001010001111010111000010100011111 = 1.1001000111101011100001010001111010111000010100011111 x 2¹

• 根据上面的公式

• 符号位：0

• 阶码部分：64位为例，1023+（1）= 1024，二进制就是10000000000

• 尾数部分：

64位为例，应为52位，1001000111101011100001010001111010111000010100011111

• 结果为 ：0100000000001001000111101011100001010001111010111000010100011111 刚好64位，大家可以数数。

再来说说为什么阶码那里要用1023+1呢？

• 因为E 在64位的时候为11位，转换10进制也就是2047，但是IEEE 754又规定要减去中间值，也就是1023，所以上面就是 1023+1

那如果遇到浮点数的计算问题该怎么办呢？

一、类库部分

Math.js

math.js是JavaScript和Node.js的一个广泛的数学库。支持数字、大数、分数、单位和矩阵数据类型的运算。

官网：https://mathjs.org/

GitHub：https://github.com/josdejong/mathjs

经典问题 0.1+0.2

var math = require('mathjs');
console.log(math.add(0.1,0.2));   //0.30000000000000004
console.log(math.format((math.add(math.bignumber(0.1),math.bignumber(0.2))))); //'0.3

big.js

• 用于任意精度的十进制算术的小型JavaScript库

• Github :https://github.com/MikeMcl/big.js/

var Big = require("big.js");
x = new Big(0.1);
y = 0.2;
console.log(x.plus(y).toString())//'0.3'

二、原生方法

Number.prototype.toFixed()

• toFixed()方法是使用定点表示法格式化一个值，对结果进行四舍五入
• toFixed(),精度必须在0-20之间

parseFloat((0.1+0.2).toFixed(10)); //0.3
parseFloat((0.3/0.1).toFixed(10)); //3
parseFloat((1-0.9).toFixed(10));   //0.1

值的范围

• 由于内存的限制，ECMAScript并不支持表示这个世界上所有的数值。ECMAScript可以表示的最小值保存在Number.MIN_VALUE中,这个值在浏览器是5e-423；可以表示的最大值保存在Number.MAX_VALUE中，这个值在浏览器中是1.7976931348623157e+308。

• 简单介绍了以后,来说说为什么要说值的范围。

• 因为还有两个值没有说，

Number.MAX_SAFE_INTEGER最大安全整数

Number.MIN_SAFE_INTEGER最小安全整数

• 其实上面我们说了那么多都是再说精度丢失，但是最根本的原因在于哪，就是因为有范围的限制。

Number.MAX_SAFE_INTEGER // 9007199254740991

1111111111111111+22222222222222222 = 23333333333333336

当我们的数值超过了值的范围进行操作就会出现精度的丢失

• 那为什么要存在他们呢?因为在此范围内整数和双精度浮点数是一一对应的，不存在一个整数有多个浮点数的情况，当然也不会又一个浮点数对应多个整数的情况。