精度丢失是一个常见的问题,特别是在涉及到浮点数计算时。
数值计算在前端开发中应用广泛,从简单的表单验证到复杂的数据可视化和动画效果的计算。然而,JavaScript(前端开发的主要编程语言)中的浮点数运算可能会导致精度丢失的问题,这是因为JavaScript遵循IEEE 754标准来表示浮点数,该标准使用二进制格式表示数值,而有些十进制小数无法精确地用二进制表示。
如下
let a=0.65
let b=3
console.log(a * b); //输出结果:1.9500000000000002
let a=1.65;
let b=3;
console.log(a*b) //输出结果 : 4.949999999999999
let a=0.3;
let b=0.1;
console.log(a - b) //输出结果 : 0.19999999999999998
解决方法1:
扩大倍数法:在进行计算之前,将浮点数乘以一个适当的倍数转换成整数,计算完成后再除回原来的倍数。
const result = ((a * 100) * (b * 100)) / 10000;
const result = ((a * 100)- (b * 100)) / 100;
其他代码: 小数点后面的零除掉,并且保留小数点后6位,
unifyNumber(num) {
if (num === '') {
return 0
} else {
let handleNum = parseFloat(num)
let isToFixed = handleNum.toString().includes('.') && handleNum.toString().split('.')[1].length > 6
if (isToFixed) {
return handleNum.toFixed(6)
}
return handleNum
}
},