资讯专栏INFORMATION COLUMN

JavaScript四舍五入的改进

Atom / 1410人阅读

摘要:但是在测试中出现了的问题。查了下资料发现是因为浮点数的存储产生的问题。失去准确性的原因关于浮点数的存储我了解不多,这里推荐这个文章给需要的同学浮点数陷阱及解法。注意返回的结果都是字符串。

前言

最近的两个项目中都有涉及到数据统计的部分,一般来说金额的数据都是选择保存2位小数,以前是使用JavaScript原生对象Number的toFixed方法。但是在测试中出现了3.235.toFixed(2) = 3.23的问题。查了下资料发现是因为浮点数的存储产生的问题。最后就自己封装了一个函数来解决这个问题。

1. toFixed失去准确性的原因

关于浮点数的存储我了解不多,这里推荐这个文章给需要的同学JavaScript 浮点数陷阱及解法。

2. 封装toFixed 2-1 实现思路

大体的思路是先分2部分,一是整数部分。整数部分不需要对值进行修改,为了和Number.toFixed保持一致,需要补上对应的0 (8.toFixed(2) => 8.00);

小数部分要做3个判断,当前小数后位数与要保存的位数进行比较。等于的直接返回,当前小数后位数小于要保存的位数就舍弃掉多余的部分。最后一种情况要针对正负数进行不同的处理,详情见下方代码。

注意:返回的结果都是字符串。

2-2 代码
let tofixed = (value, holdLen) => {
    value = value.toString();
    let dotIndex = value.indexOf(".");
    //判断是否为整数
    if (dotIndex === -1) {
        //少几位就补几位0
        let integerStr = ".";
        for (let i = 0; i < holdLen; i++) {
            integerStr = integerStr + "0";
        }
        return value + integerStr;
    }
    //获取小数点前后的字符串
    let dotBefore = value.split(".")[0];
    let dotAfter = value.split(".")[1];
    //小数点后与要保留的位数进行判断出来
    let result = "";
    if (dotAfter.length === holdLen) {
        result = value;
    } else if (dotAfter.length < holdLen) {
        let forlength = holdLen - dotAfter.length
        //少几位就补几位0
        for (let i = 0; i < forlength; i++) {
            dotAfter = dotAfter + "0";
        }
        result = dotBefore + "." + dotAfter;
    } else {
        //获取到要四舍五入的位置后一个数字的值
        let digit = value.substr(dotIndex + holdLen + 1, 1);
        if (digit >= 5) {
            let temp = Math.pow(10, 0 - holdLen);
            //负数和正数的四舍五入判断
            parseFloat(value) > 0 ? value = parseFloat(value) + temp : value = parseFloat(value) - temp;
            value = value.toString();
        }
        result = value.substr(0, dotIndex + holdLen + 1);
    }
    return result;
}
console.log(tofixed(1.335, 2));
console.log(tofixed(2.1, 3));
console.log(tofixed(-8.546, 2));
console.log(tofixed(-9, 3));

//打印结果
"1.34"
"2.100"
"-8.55"
"-9.000"

我的处理办法很粗糙,希望各位多多给出意见。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/99890.html

相关文章

  • JavaScript DOM 编程艺术》 阅读摘要

    概念: 平稳退化 渐进增强 以用户为中心 第一章 js简史 可以使用DOM(Document Object Model)给HTML(HyperText Markup Language)文档增加交互能力,就像CSS(Cascading Style Sheet)给文档增加样式一样。DOM是一种API(Application Programing Interface),就是一种已得到各方认同的基本约...

    mylxsw 评论0 收藏0
  • JavaScript四舍五入那些坑

    摘要:进制之谜众所周知,计算机在设计之初,出于各方面角度考虑,最终采用二进制的格式来存储数据。同样的情况,也会出现在十进制和二进制的转换中。当我们在计算机中,声明一个变量为,其实该数字作为二进制保存在计算机中,并不真的是。 前言 经常使用JavaScript用来处理数字的程序员都知道,JavaScript的Number.toFixed,这一函数,在格式化数字时,会自动进行四舍五入,例如: 1...

    zollero 评论0 收藏0
  • 关于JavaScript随机数方法

    摘要:另外,这几篇几个不错的随机生成随机数采用对获取的浮点数进行取整操作,也是同样的问题,能取到左端点,却无法取到右端点。 最近在琢磨内置对象Math的时候,参考了很多网上资料,不过我在Google中搜索js 随机整数,出来很多博客文章,很遗憾,在我看来排名靠前的这些文章都是错误的。接下来我将会论证我这一观点,同时把我所理解的Math.random()方法跟你分享。showImg(https...

    liuyix 评论0 收藏0
  • 如何解决0.1 +0.2===0.30000000000000004类问题

    摘要:方法使用定点表示法来格式化一个数,会对结果进行四舍五入。该数值在必要时进行四舍五入,另外在必要时会用来填充小数部分,以便小数部分有指定的位数。如果数值大于,该方法会简单调用并返回一个指数记数法格式的字符串。在环境中,只能是之间,测试版本为。 showImg(https://segmentfault.com/img/remote/1460000011913134?w=768&h=521)...

    yuanzhanghu 评论0 收藏0
  • 「干货」细说 Javascript浮点数精度丢失问题(内附好课推荐)

    摘要:前言最近,朋友问了我这样一个问题在中的运算结果,为什么是这样的虽然我告诉他说,这是由于浮点数精度问题导致的。由于可以用阶码移动小数点,因此称为浮点数。它的实现遵循标准,使用位精度来表示浮点数。 showImg(https://segmentfault.com/img/remote/1460000018981071); 前言 最近,朋友 L 问了我这样一个问题:在 chrome 中的运算...

    senntyou 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<