如何解决JS弹窗中数值无法四舍五入保留2位小数的问题？

问题原因 #

你之前用Math.round(num * 100) / 100未生效的核心原因有两个：

• $change_return_val是字符串类型，直接参与数学运算会出现类型转换异常，导致计算失败
• 该方法不会自动补全末尾的0，比如计算结果为3.1时只会返回3.1，不符合金额保留两位小数的展示要求

修复方案 #

直接将原代码替换为以下版本即可，会自动完成类型转换、四舍五入并补全两位小数，同时把提示内容改为了中文：

if ($change_return_val != "0.00") {
  // confirm('Oops amount is over.');
  // calculate_balance_due();
  // 格式化找零金额，保留两位小数
  const changeFormatted = Number($change_return_val).toFixed(2);
  swal({
    title: "找零：£" + changeFormatted,
    text: "您的找零金额为：£" + changeFormatted,
  })
}

可选优化（解决浮点数精度问题） #

如果遇到1.005这类特殊值四舍五入错误的情况，是JS浮点数精度特性导致的，可以用以下封装方法处理：

// 金额格式化通用方法
function formatCurrency(val) {
  return (Math.round((Number(val) + Number.EPSILON) * 100) / 100).toFixed(2);
}

// 调用方式
const changeFormatted = formatCurrency($change_return_val);

加Number.EPSILON是为了抵消浮点数计算的精度误差，保证四舍五入结果符合预期。

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