资讯动态

前端金额计算不再翻车:用 decimal.js 彻底解决精度问题

发布时间:2026/8/13 17:59:48 来源:尧图企业网站定制
在前端处理金额、汇率、利率等敏感数据时0.1 0.2 ! 0.3这种经典的浮点数精度误差经常导致前后端对账失败。很多同学习惯用Math.floor(amount * 100) / 100来“修复”但这只是掩耳盗铃并不能解决二进制浮点数的本质缺陷。本文将介绍如何使用decimal.js​ 这一神器实现银行级精度的金额计算。一、为什么不能用Math.floor 先看一个经典翻车现场// 期望145 // 实际144.99999999999997 const price 0.145; const result Math.floor(price * 100); console.log(result);原因JavaScript 的Number类型基于 IEEE 754 双精度浮点数在二进制中无法精确表示0.145。price * 100得到的并不是精确的145而是一个非常接近144.999999...的数字Math.floor直接把它砍成了144。结论任何基于原生Number的乘除运算在金额场景下都是不安全的。二、解决方案decimal.jsdecimal.js 是一个用于任意精度十进制算术的库它解决了 JavaScript 浮点数的痛点特别适合金融类应用。1. 安装npm install decimal.js2. 引入import { Decimal } from decimal.js;三、核心用法从创建到计算1. 创建 Decimal 对象关键千万不要直接传入数字字面量否则精度误差在创建阶段就已经产生了。❌错误写法仍有精度风险const num new Decimal(0.145); // 0.145 在传入前已经是近似值 //若接口返回的就是number型也可直接使用只是Decimal无法逆转这种误差只能保证之后的计算没有误差若遇到这种情况可让后端返回字符串即可 decimal.js 无法逆转这个误差它只能保证后续计算不再继续放大误差。 验证一下 const d new Decimal(0.145); console.log(d.toString()); // 很可能不是 0.145✅正确写法推荐// 方式一传入字符串最安全推荐 const num1 new Decimal(0.145); // 方式二传入 Number仅在数据来源无法控制时使用 const num2 new Decimal(price); // 方式三传入整数分 const num3 new Decimal(145);2. 执行精确计算Decimal 对象提供了完整的算术方法返回的都是新的 Decimal 对象。const a new Decimal(0.145); const b new Decimal(0.255); // 加法 const sum a.plus(b); // 0.4 // 减法 const diff a.minus(0.045); // 0.1 // 乘法 const product a.times(b); // 0.036975 // 除法 const quotient a.dividedBy(b); // 0.5686274509803921... //向下取整 a.floor() //截断只保留2位小数 const quotient a.toDecimalPlaces(2, Decimal.ROUND_DOWN) // 将Decimal对象转换为JavaScript原生的Number类型 const result sum.toNumber(); // 还有其他常用的方法如取模、幂运算等

读完文章,也想定制专属网站?

尧图设计师 24 小时内与您沟通定制方案

免费获取报价