环保材料 技术支持 东莞网站建设,上海专业建设网站制作,徐州市城乡建设局网站,网址缩短在线生成app本文主要是和大家聊聊关于js中经常出现数字运算结果与预期结果不一致的问题#xff0c;与及解决该问题的的方案。
一、问题现象
如#xff1a;0.1 0.2的预期结果是0.3#xff0c;但是在js中得到的计算结果却是0.30000000000000004#xff0c;如下图所示 如#xff1a;0…本文主要是和大家聊聊关于js中经常出现数字运算结果与预期结果不一致的问题与及解决该问题的的方案。
一、问题现象
如0.1 0.2的预期结果是0.3但是在js中得到的计算结果却是0.30000000000000004如下图所示 如0.3 - 0.2的预期结果是0.1但是在js中得到的计算结果为0.09999999999999998如下图所示 要想明白出现上述问题的原因还需要了解在js中数字是如何编码的。 二、js中的数字编码
JavaScript 的 数字Number 类型是一个双精度 64 位二进制格式 IEEE 754 值类似于 Java 或者 C# 中的 double。这意味着它可以表示小数值但是存储数值的大小和精度有一些限制。简而言之IEEE 754 双精度浮点数使用 64 位来表示 3 个部分
1 比特符号位sign0-正数1-负数11 比特指数位exponent-1022 到 102352 比特尾数位mantissa-小数部分表示 0 和 1 之间的数值
尾数也称为有效位数是表示实际值的数值有效数值部分。指数是尾数应乘以的 2 的幂。将其视为科学计数法 尾数使用 52 比特存储在二进制小数中解释为 1.… 之后的数值。因此尾数的精度是 2的-52次方幂可以通过 Number.EPSILON 获得或者十进制小数点后大约 15 到 17 位高于该精度级别的算术需要舍入。
一个数值可以容纳的最大值是 2的1024次方减1基于二进制的指数为 1023尾数为 0.1111...这可以通过 Number.MAX_VALUE 获得。大于该值的数值被特殊数常数 Infinity 取代。
只有在 范围内的整数才能在不丢失精度的情况下被表示可通过 Number.MIN_SAFE_INTEGER 和 Number.MAX_SAFE_INTEGER 获得因为尾数只能容纳 53 位包括前导 1。 以上内容出自Number - JavaScript | MDN 三、0.10.2不等于0.3的原因
通过上述介绍可以知道在二进制科学表示法中双精度浮点数的小数部分最多只能保留52位再加上前面的1其实就是保留53位有效数字剩余的舍去遵从“0舍1入”的原则。 // 0.1 转化为二进制
0.0 0011 0011 0011 0011...(0011无限循环 // 0.2 转化为二进制
0.0011 0011 0011 0011 0011...(0011无限循环// 0.3 转化为二进制
0.01 0011 0011 0011...(0011无限循环
如上0.1、0.2、0.3转化为二进制会出现无限循环0.10.2 不等于 0.3 因为在 0.10.2 的计算过程中发生了两次精度丢失。第一次是在 0.1 和 0.2 转成双精度二进制浮点数时由于二进制浮点数的小数位只能存储52位导致小数点后第53位的数要进行为1则进1为0则舍去的操作从而造成一次精度丢失。第二次在 0.1 和 0.2 转成二进制浮点数后二进制浮点数相加的过程中小数位相加导致小数位多出了一位又要让第53位的数进行为1则进1为0则舍去的操作又造成一次精度丢失。最终导致 0.10.2 不等于0.3 四、解决方案
1、简单粗暴的方法是使用toFixed设置保留小数位数(注意用toFixed得到的是string类型)
(0.10.2).toFixed(1) 0.3 // true
2、将其转化为整数计算后再转化为小数
(0.1*1000.2*100)/100 0.3 // true
3、使用第三方库bignumber.js
bignumber.js APIhttps://mikemcl.github.io/bignumber.js/#bignumberbignumber.js - npmA library for arbitrary-precision decimal and non-decimal arithmetic. Latest version: 9.1.1, last published: 2 months ago. Start using bignumber.js in your project by running npm i bignumber.js. There are 5883 other projects in the npm registry using bignumber.js.https://www.npmjs.com/package/bignumber.js用法很简单
npm install bignumber.js // 安装依赖包bignumber.jsimport BigNumber from bignumber.js; // 引进依赖包
let x new BigNumber(0.1) // 使用构造函数BigNumber
let result x.plus(0.2) // 结果为0.3注意输出结果为字符串数字
注意使用bignumber.js计算出来的结果为字符串。
相比较于1、2两种方法3种方法比较简单只需要在使用的时候直接调用API即可不需要开发者自行做转换。 五、bignumber.js源码解析
bignumber.js是一个用于任意精度数学运算的js库它的大致实现原理是将所有数字当成字符串重新实现了计算逻辑主要缺点就是性能比原生差。
