前端常见场景、JS计算精度丢失题目(Decimal.js 介绍)

目次
一. Decimal.js 介绍
二. 常用方法
1. 创建 Decimal 实例
 2.加法  add 或 plus
3.减法 sub 或 minus
4.乘法 times 或 mul
5.除法 div 或 dividedBy
6.取模
7.幂运算
8.平方根
9.保留小数位 toFixed方法(四舍五入)
三.项目应用

---

前端精度丢失题目通常由以下原因导致：

• 浮点数表示：由于IEEE 754尺度，某些小数无法精确表示。
  
• 运算顺序：计算机内部的运算顺序可能影响效果。
  
• 舍入偏差：除法或乘法可能必要舍入到近来的可表示浮点数。
  
• 累积偏差：连续运算可能累积小偏差，导致大弊端。
  
• 类型转换：自动类型转换可能引入精度题目。
  
• 大数溢出：超出Number类型范围的数字可能导致精度丢失。
  
• 第三方库偏差：第三方库可能存在精度题目。
  
• 平台差异：差异浏览器或JavaScript引擎可能处理浮点数差异。
  

解决策略：

• 使用高精度库（如decimal.js,big.js）
  
• 使用Math对象方法进行精确舍入
  
• 尽可能用整数运算 ( 先乘以x倍数进行计算, 计算完再整除x倍数返来 )
  

一. Decimal.js 介绍

官网: decimal.js ( 提供十进制类型的任意精度数值 )
Decimal.js 是一个小型库，用于解决浮点数计算的不精确题目
安装 decimal.js
   npm install decimal.js  
  在代码中引入 ,两种方式二选一

• require 是CommonJS模块系统的语法
  
• import  是ES6模块系统的语法
  

    const Decimal = require('decimal.js');  
   import Decimal from 'decimal.js'
  二. 常用方法

1. 创建 Decimal 实例

1. const a1 = new Decimal(0.1);   // 从数字创建
2. const a2 = new Decimal('0.2'); // 从字符串创建

复制代码

 2.加法  add 或 plus

1. const result = a1.add(a2).toNumber();
2. console.log(result); // 0.3

复制代码

3.减法 sub 或 minus

1. const result = a1.sub(a2).toNumber();
2. console.log(result); // -0.1

复制代码

4.乘法 times 或 mul

1. const result = a1.times(a2).toNumber();
2. console.log(result); // 0.02

复制代码

5.除法 div 或 dividedBy

1. const result = a1.div(a2).toNumber();
2. console.log(result); // 0.5

复制代码

6.取模

1. const result = a1.mod(a2).toNumber();
2. console.log(result); // 0.1

复制代码

7.幂运算

1. const result = a1.pow(2).toNumber();
2. console.log(result); // 0.01

复制代码

8.平方根

1. const result = a1.sqrt(2).toNumber();
2. console.log(result); // 0.31622776601683794

复制代码

9.保留小数位 toFixed方法(四舍五入)

1. const b1 = new Decimal('0.1546');
2. const b2 = new Decimal('0.1556');
3. const result1 = b1.toFixed(2);
4. const result2 = b2.toFixed(2);
5. console.log(result1); //0.15
6. console.log(result2); //0.16

复制代码

三.项目应用

项目需求: 后端约定 返回的金额展示上必要除以100, 发送后台的值乘以 100,并要求为数字类型, 假如常规运算, 有可能出现精度丢失题目, 通过使用 Decimal.js库解决 ( new Decimal() 或 Decimal() 一个意思)

1. import Decimal from 'decimal.js';
3. ...
5. // 先转换为Decimal对象, 进行乘法运算, 再转化为数字类型
6. const price = '100';
7. const res = Decimal(price ).mul(Decimal(100)).toNumber();
8. console.log(res); // 返回结果: 10
10. // 其他运算写法大差不差
11. ...

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。