JS精度丢失原因及解决方案

JS精度丢失原因及解决方案

前言

前端开发过程中，如果使用的开发语言是JavaScript，那么会存在一个非常困扰人的情况；在涉及含有小数的数字计算时，会出现计算结果与真实的结果不一致的场景；当测试数据量不足够大的时候，经常会遗漏掉某些异样数据，给用户带来不好的使用感受。

例子

  const total = 0.1 + 0.2
  // 按理应该输出 
  // total = 0.3
  // 但是你在控制台打印下面的语句会发现是为false
  console.log(total === 0.3) // false
  // total 的值为 0.30000000000000004

原因

	在 JavaScript 中所有的数字都是以 64 位浮点数的形式存储，而 0.1 和 0.2 的二进制都是无限循环的，
	数位无法满足，这必然造成了数字转换的不对等的结果，因而出现了数字精度丢失，不能得到理想
	中的结果。

解决方案

	1、使用 toFixed(),在确定小数点的位数的情况下，指定保留小数点后几位数
	(0.1 + 0.2).toFixed(1) = 0.3 // 保留一位小数

	2、使用提供更高精度的插件 decimal.js、bignumber.js 、big.js、 math.js
	// 使用 decimal.js
	const Decimal = require('decimal.js');
	let a = new Decimal('0.1');
	let b = new Decimal('0.2');
	let sum = a.add(b);
	console.log(sum.toString()); // 输出 0.3

	// 使用 bignumber.js
	const BigNumber = require('bignumber.js');
	let x = new BigNumber('0.1');
	let y = new BigNumber('0.2');
	let result = x.plus(y);
	console.log(result.toString()); // 输出 0.3

	3、小数运算，先乘对应的倍数，计算之后，在除于小童的倍数（但是要求数据不能过大）
	let a = 0.1;
	let b = 0.2;
	console.log((a * 10 + b * 10) /10); // 输出 0.3