炫意html5
最早CSS3和HTML5移动技术网站之一

javascript浮点型的一些坑

前言

javascript浮点型运算有很多问题,不管是加减还是乘除,还是四舍五入,都可能出现问题。本文简单介绍一些解决办法,都是工作中总结出来的,有简单,有麻烦。下面就总结一下。

加法运算

例如常见的:

0.1+0.2 //0.30000000000000004
1.4+2.8 //4.199999999999999

等等,这样的好多类似的运算

解决方案一:

简单方法:

这个方法要你知道保留小数点位数,好多情况不是很适用,特殊四舍五入的情况也不准确!
假如保留1位小数

(((0.1+0.2)*10).toFixed(1))/10

保留2位小数

(((0.1+0.2)*100).toFixed(2))/100

解决方案二

精确方法:
定义函数

function accAdd(arg1,arg2){
var r1,r2,m;
try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}
try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}
m=Math.pow(10,Math.max(r1,r2))
return (arg1*m+arg2*m)/m
}
accAdd(0.1,0.2)

减法运算

例如:

0.3-0.1 //0.19999999999999998

封装函数方法

function accSub(arg1,arg2){
var r1,r2,m,n;
try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}
try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}
m=Math.pow(10,Math.max(r1,r2));
//last modify by deeka
//动态控制精度长度
n=(r1>=r2)?r1:r2;
return ((arg1*m-arg2*m)/m).toFixed(n);
}

乘法运算

案例

0.69*10 //6.8999999999999995
11*22.9 //251.89999999999998

解决方案一

如果在知道小数位个数的前提下,可以考虑通过将浮点数放大倍数到整型(最后再除以相应倍数),再进行运算操作,这样就能得到正确的结果了。
例如

0.69*10*10/10
11*(22.9*10)/10

解决方案二

封装函数方法

function accMul(arg1,arg2)
{
var m=0,s1=arg1.toString(),s2=arg2.toString();
try{m+=s1.split(".")[1].length}catch(e){}
try{m+=s2.split(".")[1].length}catch(e){}
return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m)
}
accMul(0.69,10) //6.9

除法运算

例如:

6.9/10 //0.6900000000000001

封装函数方法

function acc(arg1,arg2){
var t1=0,t2=0,r1,r2;
try{t1=arg1.toString().split(".")[1].length}catch(e){}
try{t2=arg2.toString().split(".")[1].length}catch(e){}
with(Math){
r1=Number(arg1.toString().replace(".",""))
r2=Number(arg2.toString().replace(".",""))
return (r1/r2)*pow(10,t2-t1);
}
}

四舍五入方法

案例如下:

10.145.toFixed(2) ---> "10.14"

四舍五入之后应该是10.15,最后却变成了10.14

原因是因为

10.145.toPrecision(21) ---> "10.1449999999999995737"

解决方案一:

简单解决方案还是先乘以100,然后,四舍五入。最后再除以100

例如

Math.round(10.145*100)/100

当然,也可以用函数封装方法,我们将tofixed重新封装一下:

Number.prototype.toFixed = function (n) {
if (n > 20 || n < 0) {
throw new RangeError('toFixed() digits argument must be between 0 and 20');
}
const number = this;
if (isNaN(number) || number >= Math.pow(10, 21)) {
return number.toString();
}
if (typeof (n) == 'undefined' || n == 0) {
return (Math.round(number)).toString();
}
let result = number.toString();
const arr = result.split('.');
// 整数的情况
if (arr.length < 2) {
result += '.';
for (let i = 0; i < n; i += 1) {
result += '0';
}
return result;
}
const integer = arr[0];
const decimal = arr[1];
if (decimal.length == n) {
return result;
}
if (decimal.length < n) {
for (let i = 0; i < n - decimal.length; i += 1) {
result += '0';
}
return result;
}
result = integer + '.' + decimal.substr(0, n);
const last = decimal.substr(n, 1);
// 四舍五入,转换为整数再处理,避免浮点数精度的损失
if (parseInt(last, 10) >= 5) {
const x = Math.pow(10, n);
result = (Math.round((parseFloat(result) * x)) + 1) / x;
result = result.toFixed(n);
}
return result;
};

小结

处理此类问题,其实都有简单办法,不过,有时候在某种场景下面,简单办法不一定适用罢了。
简单办法一般是:
将浮点数乘以(扩大)10的n次方倍,把浮点数变为整数后再进行相应的运算,最后将得到的结果除以(缩小)10的n次方倍
但是有时候我们并不知道浮点数的位数,及要精确的小数位数,因此,面对这种场景,我们就要用函数了!

炫意HTML5 » javascript浮点型的一些坑

Java基础教程Android基础教程