深入了解toFixed()和Math.round()

最新推荐文章于 2024-09-12 10:26:34 发布

我是一只探索的程序猿

最新推荐文章于 2024-09-12 10:26:34 发布

阅读量8k

点赞数 4

分类专栏： javascript 文章标签： toFixed Math.round round 保留两位小数金额问题

本文链接：https://blog.csdn.net/qq_37811638/article/details/78529401

版权

javascript 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

近日，在公司做项目时，遇到处理金额问题，要保留两位小数，由此发现s.toFixed(2);函数和Math.round(2);函数的问题所在。

以下内容来源自网络，不过经本人验证，确实存在这样的问题：

Java Math的 floor,round和ceil的总结
1、floor 返回不大于的最大整数（向下取整）
2、round 则是4舍5入的计算，入的时候是到大于它的整数（当-1.5时可见，四舍五入后得到的结果不是我们期待的，解决办法是先对他取绝对值，然后在用round方法）

round方法，它表示“四舍五入”，算法为Math.floor(x+0.5)，即将原来的数字加上0.5后再向下取整，所以，Math.round(11.5)的结果为12，Math.round(-11.5)的结果为-11。

3、ceil 则是不小于他的最小整数（向上取整）

看例子

num	Math.floor	Math.round	Math.ceil
1.4	1	1	2
1.5	1	2	2
1.6	1	2	2
-1.4	-2	-1	-1
-1.5	-2	-1	-1
-1.6	-2	-2	-1

至于toFixed()

var k = 1.74.toFixed(1), m = 1.75.toFixed(1), n = 1.76.toFixed(1);

结果 1.7,1.8,1.8

测试程序如下：

public class MyTest {
public static void main(String[] args) {
    double[] nums = { 1.4, 1.5, 1.6, -1.4, -1.5, -1.6 };
    for (double num : nums) {
      test(num);
    }
}

private static void test(double num) {
    System.out.println("Math.floor(" + num + ")=" + Math.floor(num));
    System.out.println("Math.round(" + num + ")=" + Math.round(num));
    System.out.println("Math.ceil(" + num + ")=" + Math.ceil(num));
}
}

运行结果
Math.floor(1.4)=1.0
Math.round(1.4)=1
Math.ceil(1.4)=2.0
Math.floor(1.5)=1.0
Math.round(1.5)=2
Math.ceil(1.5)=2.0
Math.floor(1.6)=1.0
Math.round(1.6)=2
Math.ceil(1.6)=2.0
Math.floor(-1.4)=-2.0
Math.round(-1.4)=-1
Math.ceil(-1.4)=-1.0
Math.floor(-1.5)=-2.0
Math.round(-1.5)=-1
Math.ceil(-1.5)=-1.0
Math.floor(-1.6)=-2.0
Math.round(-1.6)=-2
Math.ceil(-1.6)=-1.0

那么问题来了，如下所示

1、toFixed 有时不能准确的四舍五入

var s = 1.555;

y = 2;

console.log(s.toFixed(y));//chrome执行结果：1.55

var intoFixed = function(x,y){

x =x * Math.pow(10,y);

x =Math.round(x);

x =x * Math.pow(10,-y);

return x;

}

console.log(intoFixed(s,y))//chrome执行结果：1.56

//另外，toString也有类似的‘坑’，e.g. 1.00.toString

2、toFixed计算错误(依赖银行家舍入法的缺陷)解决方法

在公司项目中涉及到一个有大量浮点数价格计算的模块，从而引发了我一系列的思考：

计算机二进制环境下浮点数的计算精度缺失问题;


 
 1
2 console.log(.1+.2);
0.30000000000000004

为了解决上述问题,使用了toFixed方法却出现了浮点数小数位以5结尾的四舍五入错误问题;


 
 1
2
3 var num = 0.045;
console.log(num.toFixed(2));
0.04

以此为起点，引发了我关于toFixed的一系列探索，终于找到了一些有用的信息，toFixed使用的计算规则是：

银行家舍入:所谓银行家舍入法，其实质是一种四舍六入五取偶（又称四舍六入五留双）法。
简单来说就是：四舍六入五考虑，五后非零就进一，五后为零看奇偶，五前为偶应舍去，五前为奇要进一。

正文

下面我们就来证实这个所谓的银行家舍入法，证实分为三种情况，分别以4、5、6为舍入位对toFixed的证实(以chrome为例)：

以4为舍入位：


 
 1
2
3
4
5
6
7
8
9 var num = 0.004;
console.log(num.toFixed(2));
0.00
var num = 0.014;
console.log(num.toFixed(2));
0.01
var num = 0.094;
console.log(num.toFixed(2));
0.09

在4结尾这种情况下toFixed表现的还算不错,并没有错误的问题。

以6为舍入位：


 
 1
2
3
4
5
6
7
8
9 var num = 0.006;
console.log(num.toFixed(2));
0.01
var num = 0.016;
console.log(num.toFixed(2));
0.02
var num = 0.096;
console.log(num.toFixed(2));
0.10

以6结尾这种情况下toFixed表现的也不错,并没有错误的问题。

以5为舍入位：
- 5后非零：


 
 1
2
3
4
5
6
7
8
9 var num = 0.0051;
console.log(num.toFixed(2));
0.01
var num = 0.0052;
console.log(num.toFixed(2));
0.01
var num = 0.0059;
console.log(num.toFixed(2));
0.01

根据规则，五后非零就进一，我们证实并没有任何的问题。

以5为舍入位：
- 5后为零：由于这种情况比较特殊，是toFixed方法出现计算错误的情况，所以我进行了大量的证实，且分别在常见的主流浏览器下进行了测试：
  以如下测试用例为例：


 
 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20 var num = 0.005;
console.log(num.toFixed(2));
var num = 0.015;
console.log(num.toFixed(2));
var num = 0.025;
console.log(num.toFixed(2));
var num = 0.035;
console.log(num.toFixed(2));
var num = 0.045;
console.log(num.toFixed(2));
var num = 0.055;
console.log(num.toFixed(2));
var num = 0.065;
console.log(num.toFixed(2));
var num = 0.075;
console.log(num.toFixed(2));
var num = 0.085;
console.log(num.toFixed(2));
var num = 0.095;
console.log(num.toFixed(2));

chrome、firefox、safari、opera的结果如下：

ie11结果如下：

可以看出Ie11下正常，其余浏览器下均出现错误。虽然并不完全符合银行家舍入法的规则，我认为是由于二进制下浮点数的坑导致了不完全符合该规则。
总而言之：不论引入toFixed解决浮点数计算精度缺失的问题也好，它有没有使用银行家舍入法也罢，都是为了解决精度的问题，但是又离不开二进制浮点数的环境，但至少他帮助我们找到了问题所在，从而让我们有解决方法。

解决方法

下面我提供一种通过重写toFixed的方法：


 
 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29         Number.prototype.toFixed = function(length)
        {
            var carry = 0; //存放进位标志
            var num,multiple; //num为原浮点数放大multiple倍后的数，multiple为10的length次方
            var str = this + ''; //将调用该方法的数字转为字符串
            var dot = str.indexOf("."); //找到小数点的位置
            if(str.substr(dot+length+1,1)>=5) carry=1; //找到要进行舍入的数的位置，手动判断是否大于等于5，满足条件进位标志置为1
            multiple = Math.pow(10,length); //设置浮点数要扩大的倍数
            num = Math.floor(this * multiple) + carry; //去掉舍入位后的所有数，然后加上我们的手动进位数
            var result = num/multiple + ''; //将进位后的整数再缩小为原浮点数
            /*
            * 处理进位后无小数
            */
            dot = result.indexOf(".");
            if(dot < 0){
                result += '.';
                dot = result.indexOf(".");
            }
            /*
            * 处理多次进位
            */
            var len = result.length - (dot+1);
            if(len < length){
                for(var i = 0; i < length - len; i++){
                    result += 0;
                }
            }
            return result;
        }