如何使用big.js解决JavaScript浮点数精度丢失问题

 更新时间:2023年12月21日 11:25:17   作者:小绵杨Yancy  
最近在项目中涉及到金额从元转为分(乘100即可),发现乘法居然也会有精度丢失的问题,关于浮点数计算精度丢失是很多语言都存在的问题,本文给大家分享使用big.js解决JavaScript浮点数精度丢失问题,感兴趣的朋友一起看看吧

一、精度丢失

关于浮点数计算精度丢失是很多语言都存在的问题,例如比较著名的:

0.1 + 0.2 === 0.30000000000000004

最近在项目中涉及到金额从元转为分(乘100即可),发现乘法居然也会有精度丢失的问题:

19.9 * 100 === 1989.9999999999998

因为涉及到了金额,所以一定不能出现这样的问题。可以直接使用:

Number(Number(19.9 * 100).toFixed()) === 1990

但其实toFixed()方法也会造成的精度丢失,后来发现,有一个专门处理js精度问题的库:http://mikemcl.github.io/big.js/

二、Big.js

安装:

npm install big.js

项目中引入:

import Big from 'big.js';

使用Big构造函数可以创建一个Big对象,调用对应的方法即可实现我们的计算需求。

let x = new Big(0.1)

在这里插入图片描述

注意最后我们需要使用toNumber方法重新将Big对象转为数字。

2.1 加

Big对象上的plus方法实现加运算。

0.1 + 0.2                  // 0.30000000000000004
x = new Big(0.1)
y = x.plus(0.2).toNumber()            // 0.3
Big(0.7).plus(x).plus(y).toNumber()   // 1.1

2.2 减

Big对象上的minus方法实现减运算。

0.3 - 0.1                  // 0.19999999999999998
x = new Big(0.3)
x.minus(0.1).toNumber()               // 0.2

2.3 乘

Big对象上的times方法实现乘运算。

0.6 * 3                    // 1.7999999999999998
x = new Big(0.6)
y = x.times(3).toNumber()             // 1.8
Big('7e+500').times(y).toNumber()     // Infinity
Big('7e+500').times(1.8).toString()   // '1.26e+501'

2.4 除

Big对象上的div方法实现除运算。

x = new Big(355)
y = new Big(113)
x.div(y).toNumber()                   // 3.14159292035398230088
Big.DP = 2
x.div(y).toNumber()                   // 3.14
x.div(5).toNumber()                   // 71

DP:涉及除法的操作结果的最大小数位数。它仅与 div 和 sqrt 方法相关,以及当指数为负时与 pow 方法相关。

2.5 指数

Big对象上的pow方法实现指数运算。

Math.pow(0.7, 2)           // 0.48999999999999994
x = new Big(0.7)
x.pow(2)                   // '0.49'
Big.DP = 20
Big(3).pow(-2)             // '0.11111111111111111111'
new Big(123.456).pow(1000).toString().length     // 5099
new Big(2).pow(1e+6)       // Time taken (Node.js): 9 minutes 34 secs.

到此这篇关于如何使用big.js解决JavaScript浮点数精度丢失问题的文章就介绍到这了,更多相关js浮点数精度丢失内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • js实现圆盘记速表

    js实现圆盘记速表

    本文分享了一个利用AmCharts制作的汽车速度计速表,通过设置不同的速度(数字)来动态改变计速表的指针。使用也非常简单,下面给出方法。
    2015-08-08
  • js实现轮播图自动切换

    js实现轮播图自动切换

    这篇文章主要为大家详细介绍了js实现轮播图自动切换,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • JS数组求和的常用方法实例小结

    JS数组求和的常用方法实例小结

    这篇文章主要介绍了JS数组求和的常用方法,结合实例形式总结分析了javascript常见的遍历、循环、归并等数组操作相关技巧,需要的朋友可以参考下
    2019-01-01
  • 使用纯JS实现checkbox的框选效果(鼠标拖拽多选)

    使用纯JS实现checkbox的框选效果(鼠标拖拽多选)

    最近做了一个用js实现鼠标拖拽多选的功能,于是整理了一下思路,写了一个小demo,下面这篇文章主要给大家介绍了关于如何使用纯JS实现checkbox的框选效果(鼠标拖拽多选)的相关资料,需要的朋友可以参考下
    2022-05-05
  • JavaScript使用Canvas绘制一个验证码组件

    JavaScript使用Canvas绘制一个验证码组件

    验证码,这一日常伴随我们的要素,是我们在线交互的重要安全保障,你的手机短信里是否被它占据半壁江山,今天我们就来聊聊如何在网页上实现一个简单的验证码组件,需要的朋友可以参考下
    2023-09-09
  • 在IE中调用javascript打开Excel的代码(downmoon原作)

    在IE中调用javascript打开Excel的代码(downmoon原作)

    在IE中调用javascript打开Excel的代码(downmoon原作)...
    2007-04-04
  • layui输入框只允许输入中文且判断长度的例子

    layui输入框只允许输入中文且判断长度的例子

    今天小编就为大家分享一篇layui输入框只允许输入中文且判断长度的例子,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • 基于webpack 实用配置方法总结

    基于webpack 实用配置方法总结

    下面小编就为大家带来一篇基于webpack 实用配置方法总结。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-09-09
  • Javascript实现简易导航栏

    Javascript实现简易导航栏

    这篇文章主要为大家详细介绍了Javascript实现简易导航栏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-06-06
  • js操作iframe的一些方法介绍

    js操作iframe的一些方法介绍

    本篇文章介绍了js操作iframe的一些方法的实例代码与步骤,有需要的朋友可以参考一下
    2013-06-06

最新评论