保姆级Decimal.js使用教程(解决js精度问题)
精度问题控制台图样

如果银行的业务你这样做,不知道要损失多少钱,这样是不行的,计算的不准确是需要背锅的,我们给后端去做吧,其实我们前端也是可以做的,引入Decimal.js
01.引入Decimal.js
decimal.js是使用的二进制来计算的,所以可以更好地实现格化式数学运算,对数字进行高精度处理;使用decimal类型处理数据可以保证数据计算更为精确,还可以节省储存空间。
$ npm install --save decimal.js
/** Node.js */
var Decimal = require('decimal.js')
/** ES6 方式 */
import { Decimal } from 'decimal.js'02.使用
<template>
<div>
test
</div>
</template>
<script>
import Decimal from 'decimal.js'
export default {
created() {
console.log('打印8.12*100的结果', 8.12*100)
console.log('打印9.12*100的结果', 9.12*100)
let c = new Decimal(8.12).mul(new Decimal(100))
let d = new Decimal(9.12).mul(new Decimal(100))
console.log('c', c)
console.log('d', d)
}
}
</script>

加减乘除全上
const a = 9.98;
const b = 8.03;
// 加法
let c = new Decimal(a).add(new Decimal(b))
// 减法
let d = new Decimal(a).sub(new Decimal(b))
// 乘法
let e = new Decimal(a).mul(new Decimal(b))
// 除法
let f = new Decimal(a).div(new Decimal(b))附:Vue项目完整例子
下面是一个完整的示例,展示了如何在Vue项目中使用decimal.js库进行高精度计算:
<template>
<div>
<p>0.1 + 0.2 = {{ result }}</p>
</div>
</template>
<script>
import { Decimal } from 'decimal.js';
export default {
data() {
return {
result: null,
};
},
mounted() {
const num1 = new Decimal(0.1);
const num2 = new Decimal('0.2');
const sum = num1.plus(num2);
this.result = sum.toNumber();
},
};
</script>
在上述示例中,我们通过Decimal类创建了两个Decimal对象,并使用plus()方法执行加法运算。最后,通过toNumber()方法将结果转换为JavaScript原生的Number类型,并绑定到Vue组件的result数据属性上,以在模板中显示计算结果。
总结
到此这篇关于保姆级Decimal.js使用的文章就介绍到这了,更多相关Decimal.js解决精度问题内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
Markdown与Bootstrap相结合实现图片自适应属性
Markdown 是一种轻量级的标记语言,它的优点很多,目前也被越来越多的写作爱好者,撰稿者广泛使用。接下来通过本文给大家介绍Markdown与Bootstrap相结合实现图片自适应属性,感兴趣的朋友一起学习吧2016-05-05
详解JavaScript对Date对象的操作问题(生成一个倒数7天的数组)
最近项目需求要生成一个倒数7天的数组,下面小编把我的实现思路和代码整理分享给大家,供大家参考,需要的朋友可以参考下2015-10-10


最新评论