js运算精度丢失

这篇具有很好参考价值的文章主要介绍了js运算精度丢失。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

目录

问题所在:

 解决方法1(低精度):

toFixed介绍:

代码实现:

小结:

解决方法2(高精度):

代码实现:

小结:


当两个数包含小数进行运算的时候结果并不是正确的结果,而是出现了精度丢失的情况(小数点后面出现很多位)。

问题所在:

 res.orderColorDeliveryRecords.forEach((item) => {
                        //计算金额
                        item.money = (item.price * item.amount);
                        if(!item.cusTypeName){
                            item.cusTypeName = 'N/A';
                        }
                        this.record.money += parseFloat(item.money);
                    });

界面显示:

js运算精度丢失

 解决方法1(低精度):

在运算结果的后面加上toFixed(),精度要求不高的情况下使用;

toFixed介绍:

        用法: number.toFixed( value )

        参数:此函数参数列表有一个参数,他表示小数点后面精确的位数。

       返回值:他以字符串表示形式返回一个数字。

代码实现:

res.orderColorDeliveryRecords.forEach((item) => {
    item.money = this.actionOperationResult(item.price , item.amount);

    
    if(!item.cusTypeName){
        item.cusTypeName = 'N/A';
    }
    this.record.money += parseFloat(item.money);
});

界面显示:

js运算精度丢失

小结:

该解决方法只适用于低精度运算。并且有弊端,就如上图界面显示一样,最终运算结果是没有小数位的,还是将小数位给显示出来的。如果不在乎这些还是可以使用的。

解决方法2(高精度):

        先将运算值 x 10^n 转换成整数进行运算,最后将结果还原。精度要求高的推荐使用该解决方法。(代码实现只实现了乘法,需要其他运算的可以自行更改一下)

代码实现:


actionOperationResult(val1, val2){
    const p = this.actionOperation(val1, val2);
    return ((val1 * p) * (val2 * p)) / (p * p);
},

actionOperation(val1, val2){
    const len1 = val1.toString().length - val1.toString().indexOf(".") - 1;
    const len2 = val2.toString().length - val2.toString().indexOf(".") - 1;
    const p = Math.max(len1, len2);
    // 避免最终求出结果的长度大于最大长度的时候导致精度丢失 开启下面
    // p += p - Math.min(len1, len2); 
    return  Math.pow(10, p);
}

测试1:

item.money = this.actionOperationResult(item.price , item.amount);     

 界面显示:

js运算精度丢失

 测试2:

const test  = this.actionOperationResult(123.456789435252 , 42.697894);
const test1  = this.actionOperationResult(4342.57897 , 64789.337489);
const test2  = this.actionOperationResult(78.7897398 , 67.768978943);
console.log("test:",test);
console.log("test1:",test1);
console.log("test2:",test2);

输出结果:

js运算精度丢失

小结:

该解决方法适用于高精度运算,既解决了精度丢失问题,又解决了我想要的最终结果是整数不显示小数位的问题。如果要求高精度请选择该解决方案。文章来源地址https://www.toymoban.com/news/detail-425491.html

到了这里,关于js运算精度丢失的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • SpringBoot解决前端js处理大数字丢失精度问题Long转String

    一、Jackson对Long类型的处理导致精度丢失的问题 表的某一个字段的类型是 BIGINT,对应的 Java 类的属性的类型就是 Long。当这个字段的值由后端返回给前端网页时,发现了精度丢失的问题。比如后端返回的值是 588085469986509185,到了前端是 588085469986509200,后面的几位数变成了

    2024年02月21日
    浏览(49)
  • js精度丢失的问题

    1.js精度丢失的常见问题,从常见的浮点型进行计算,到位数很长的munber类型进行计算都会造成精度丢失的问题, 首先我们看一个问题: 那么js为什么会出现精度丢失的问题: 计算机的二进制实现和位数限制有些数无法有限表示。就像一些无理数不能有限表示,如 圆周率 3.1

    2024年02月14日
    浏览(51)
  • MyBatis-Plus主键策略(雪花算法16位长度的整型id,解决默认雪花算法生成19位长度id导致JS精度丢失问题)

    js表达的最大整数2的53次方减1,精度丢失后面几位全是0! 如果内置支持不满足你的需求,可实现 IKeyGenerator 接口来进行扩展. 举个栗子 #方式一:使用配置类 #方式二:通过 MybatisPlusPropertiesCustomizer 自定义 #方式一: XML 配置 #方式二:注解配置 官方示例 官方id generator示例 htt

    2023年04月08日
    浏览(43)
  • 完美解决!处理精度丢失问题点

    目录 1. 解决后端响应数据给前端出现精度丢失问题 2. Freemark BigDecimal数据显示精度丢失问题 3. 前端调用方法传值精度丢失问题 解决方式一: 在项目中都是将注解标注在对应字段上,在Json序列化的时候把Long自动转为String。  解决方式二: 全局配置 每个实体类的id字段都需要

    2024年02月15日
    浏览(70)
  • 如何解决前端传递数据给后端时精度丢失问题

    有时候我们在进行修改操作时,发现修改既不报错也不生效。我们进行排查后发现服务器端将数据返回给前端时没有出错,但是前端js将数据进行处理时却出错了,因为id是Long类型的,而js在处理后端返回给前端的Long类型数据时只能处理前16位,后3位进行了四舍五入操作,例

    2024年02月09日
    浏览(63)
  • 如何完美解决前端数字计算精度丢失与数字格式化问题?

    大家好,我是木瓜太香,做前端开发经常会遇到数字计算精度丢失的问题,和数字格式化的麻烦问题,好不容易找到了可以解决这些问题的库结果用起来不够方便,例如 bignumber.js decimal.js 等编写体验不好,这篇文章来帮助你完美解决这些问题 接下来我们根据以下两个问题展

    2024年02月16日
    浏览(47)
  • SpringBoot返回前端Long类型字段丢失精度问题及解决方案

    Java服务端返回Long整型数据给前端,JS会自动转换为Number类型。而Long类型能表示的最大值为(),当数值超过JS中Number类型的最大值()时,就会丢失精度。 首先,引入依赖。 新建一个自定义大数据序列化类,如下: 新建Jackson配置类 本文针对Java服务端返回Long整型数据给前端时

    2024年03月22日
    浏览(105)
  • Es 通过javaApi上传数据Long类型丢失精度的问题一次性解决

    通过 updateRequest.docAsUpsert(true) true 表示无匹配_id是插入数据,false 表示无匹配_id会抛出异常

    2024年02月15日
    浏览(56)
  • Java中整数相除并保留两位小数的实现方式、保留两位小数:Java中整数相除的处理方法、解决Java整数相除后精度丢失的问题、Java数值计算:整数相除保留指定小数位数的技巧

    当在Java中需要进行整数相除并保留两位小数时,可以使用以下两种方式实现: 1. 使用浮点数类型和DecimalFormat进行格式化:  2. 使用BigDecimal类进行精确的数值计算和格式化输出: 在选择使用哪种方式时,需要根据具体的业务需求和数值计算的精度要求进行权衡和选择。如果

    2024年02月12日
    浏览(42)
  • JavaScript:解决计算精度问题/mathjs/bignumber.js/big.js/decimal.js

    一、计算精度现象举例 举例1、加法 举例2、减法    举例3、乘法 举例3、除法 二、JS为什么会有计算精度的问题 JavaScript 内部只有一种数字类型Number,也就是说,JavaScript 语言的底层根本没有整数,所有数字都是以IEEE-754标准格式64位浮点数形式储存,1与1.0是相同的。因为有

    2024年02月10日
    浏览(42)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包