JavaScript 浮点数精度问题的根源与安全修复方案-js教程-PHP中文网

JavaScript 浮点数精度问题的根源与安全修复方案

javascript 中 `0.2 + 0.1` 得到 `0.30000000000000004` 是因二进制浮点表示无法精确存储十进制小数；乘以 10 再除以 10 并非“解决”问题，而是偶然规避了误差，真正可靠的方法是结合整数运算与显式舍入。

在 JavaScript 中，所有数字均遵循 IEEE 754 双精度浮点标准，而像 0.1 和 0.2 这类十进制小数，在二进制下是无限循环小数（例如 0.1₂ = 0.0001100110011…₂），必须被截断存储，导致固有精度损失。因此 0.2 + 0.1 不等于精确的 0.3，而是产生微小误差：

console.log(0.2 + 0.1); // → 0.30000000000000004

你提到的写法 let y = (0.2 * 10 + 0.1 * 10) / 10 看似“修复”了结果，输出 0.3，但这只是巧合性掩盖，而非根本性解决。原因在于：

0.2 * 10 实际计算为 2.0000000000000004，0.1 * 10 为 1.0000000000000002；
二者相加得 3.0000000000000004，再除以 10 得 0.30000000000000004；
但当该值被字符串化（如 + y 拼接）或显示在 DOM 中时，JavaScript 引擎会自动进行“最短可区分字符串”舍入（参见 ECMA-262 7.1.12.1），恰好显示为 "0.3"——这并非数值变准了，而是显示优化。

⚠️ 风险示例：该技巧在其他场景会失效：

Miller CSV TSV JSON 数据处理器

Miller (mlr) 是一个命令行工具，用于查询、整形和重新格式化名称索引数据，如 CSV、TSV、JSON 和 JSON Lines。它将 awk、sed、cut、join 和 sort 的功能整合到一个专为结构化数据处理而构建的单一工具中。

下载

let a = 0.29 * 100;     // → 28.999999999999996
let b = 0.71 * 100;     // → 71.00000000000001
console.log((a + b) / 100); // → 1.0000000000000002 （不是 1.0）

✅ 正确做法：先缩放为整数，再显式舍入，最后还原
使用 Math.round() 消除中间计算的浮点噪声，确保参与加法的是精确整数：

let y = (Math.round(0.2 * 10) + Math.round(0.1 * 10)) / 10;
// → (2 + 1) / 10 = 0.3 （数值本身即为精确 0.3）
document.getElementById("abc").innerHTML = "0.2 + 0.1 = " + y;

? 通用封装建议（支持任意小数位）：

function addFloats(...nums) {
  const decimals = 10; // 保留 1 位小数 → 乘以 10
  const factor = Math.pow(10, decimals);
  return Math.round(nums.reduce((sum, n) => sum + n * factor, 0)) / factor;
}
console.log(addFloats(0.2, 0.1)); // → 0.3
console.log(addFloats(0.29, 0.71)); // → 1.0

? 总结：