JavaScript浮点数计算出现多余无用小数的原因及规避方案

问题原因 #

这是所有遵循IEEE 754浮点数标准的编程语言的共性特性，并非JavaScript的独有bug。

• JavaScript的所有数字都以64位双精度浮点数格式存储，十进制小数转换为二进制时，类似0.1这类数值的二进制表示是无限循环的，受限于64位的存储长度，系统会自动截断超出精度的部分，导致存储的数值和原始十进制数值存在微小误差。
• 10.1、20.1转换为二进制浮点数时本身就存在精度损失，二者相加后误差进一步累积，最终输出结果就会出现30.200000000000003这类多余小数位的情况；而10.2和20.2的二进制舍入误差在相加后刚好抵消，或者落在了精度输出的容错范围内，所以结果看起来是正常的。

规避方案 #

1. 整数转换法 #

将参与计算的小数先放大为整数完成运算，再缩小对应倍数，误差控制效果稳定。

// 通用加法函数
function preciseAdd(a, b) {
  const aDecimalLen = (a.toString().split('.')[1] || '').length;
  const bDecimalLen = (b.toString().split('.')[1] || '').length;
  const multiple = Math.pow(10, Math.max(aDecimalLen, bDecimalLen));
  return (a * multiple + b * multiple) / multiple;
}
console.log(preciseAdd(10.1, 20.1)); // 输出 30.2

2. 固定小数位截断法 #

如果业务明确要求保留的小数位数，可以用toFixed方法处理后转换回数值，适合轻量计算场景。

const result = 10.1 + 20.1;
console.log(Number(result.toFixed(1))); // 输出 30.2

3. 第三方库处理 #

如果项目涉及大量高精度计算（比如金融金额计算），可以直接使用成熟的精度计算库，避免手动处理边缘情况出错。

内容的提问来源于stack exchange，提问作者Asturion