前端vue項(xiàng)目如何使用Decimal.js做加減乘除求余運(yùn)算
更新時(shí)間：2024年05月28日 08:59:23 作者：H_HX126
decimal.js是使用的二進(jìn)制來計(jì)算的,可以更好地實(shí)現(xiàn)格化式數(shù)學(xué)運(yùn)算,對數(shù)字進(jìn)行高精度處理,使用decimal類型處理數(shù)據(jù)可以保證數(shù)據(jù)計(jì)算更為精確,這篇文章主要給大家介紹了關(guān)于前端vue項(xiàng)目如何使用Decimal.js做加減乘除求余運(yùn)算的相關(guān)資料,需要的朋友可以參考下
1 vue項(xiàng)目安裝Decimal
npm install decimal.js
2 注意
運(yùn)算結(jié)果是Decimal對象，需要使用.toNumber()轉(zhuǎn)為數(shù)字
3 加 add
const Decimal = require('decimal.js')
const num1 = Decimal("5");
const num2 = Decimal("3");
const remainder = num1.add(num2);
4 減 sub
const Decimal = require('decimal.js')
const num1 = Decimal("5");
const num2 = Decimal("3");
const remainder = num1.sub(num2);
5 乘 mul
const Decimal = require('decimal.js')
const num1 = Decimal("5");
const num2 = Decimal("3");
const remainder = num1.mul(num2);
6 除 div
const Decimal = require('decimal.js')
const num1 = Decimal("5");
const num2 = Decimal("3");
const remainder = num1.div(num2);
7 求余 modulo
const Decimal = require('decimal.js')
const num1 = Decimal("5");
const num2 = Decimal("3");
const remainder = num1.modulo(num2);附：vue 使用decimal.js 解決小數(shù)相加合計(jì)精確度丟失問題
- 安裝依賴 decimal.js
- npm install --save decimal.js
- 封裝
- 在utils文件夾下創(chuàng)建decimal.js文件
import { Decimal } from 'decimal.js'
export function add (x, y) {
if (!x) {
x = 0
}
if (!y) {
y = 0
}
const xx = new Decimal(x)
const yy = new Decimal(y)
return xx.plus(yy).toNumber()
}
// 減
export function sub (x, y) {
if (!x) {
x = 0
}
if (!y) {
y = 0
}
const xx = new Decimal(x)
const yy = new Decimal(y)
return xx.sub(yy).toNumber()
}
// 除
export function div (x, y) {
if (!x) {
x = 0
}
if (!y) {
return 0
}
const xx = new Decimal(x)
const yy = new Decimal(y)
return xx.div(yy).toNumber()
}
//乘
export function mul (x, y) {
if (!x) {
x = 0
}
if (!y) {
y = 0
}
const xx = new Decimal(x)
const yy = new Decimal(y)
return xx.mul(yy).toNumber()
}
- 頁面使用
<script>
import {add} from "@/utils/decimal"
export default {
methods:{
handlePlus() {
add(10.5,4.877)
}
}
}
</script>總結(jié)
到此這篇關(guān)于前端vue項(xiàng)目如何使用Decimal.js做加減乘除求余運(yùn)算的文章就介紹到這了,更多相關(guān)vue Decimal.js做加減乘除求余運(yùn)算內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
vue中的事件加判斷條件如何進(jìn)行選擇性點(diǎn)擊
這篇文章主要介紹了vue中的事件加判斷條件如何進(jìn)行選擇性點(diǎn)擊方式,具有很好的參考價(jià)值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
vue3+luckysheet實(shí)現(xiàn)在線編輯Excel的項(xiàng)目實(shí)踐
本文介紹了使用Luckysheet實(shí)現(xiàn)在線Excel表格功能,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2025-07-07
利用Vue+ElementUi實(shí)現(xiàn)評論功能
這篇文章主要介紹了如何利用Vue+ElementUi實(shí)現(xiàn)評論功能,結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2024-04-04
本篇文章主要介紹了vue父子組件的嵌套的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-09-09
在Vue中實(shí)現(xiàn)地圖熱點(diǎn)展示與交互的方法詳解（如熱力圖）
隨著大數(shù)據(jù)和可視化技術(shù)的發(fā)展，地圖熱點(diǎn)展示越來越受到人們的關(guān)注，在Vue應(yīng)用中，我們通常需要實(shí)現(xiàn)地圖熱點(diǎn)的展示和交互，以便更好地呈現(xiàn)數(shù)據(jù)和分析結(jié)果，本文將介紹在Vue中如何進(jìn)行地圖熱點(diǎn)展示與交互，包括熱力圖、點(diǎn)聚合等2023-07-07
vue實(shí)現(xiàn)裁切圖片同時(shí)實(shí)現(xiàn)放大、縮小、旋轉(zhuǎn)功能
這篇文章主要介紹了vue實(shí)現(xiàn)裁切圖片同時(shí)實(shí)現(xiàn)放大、縮小、旋轉(zhuǎn)功能，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-03-03
vite中的glob-import批量導(dǎo)入的實(shí)現(xiàn)
本文主要介紹了vite中的glob-import批量導(dǎo)入的實(shí)現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-07-07
vue使用transition組件動畫效果的實(shí)例代碼
這篇文章主要介紹了vue使用transition組件動畫效果的實(shí)例代碼,本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-01-01
實(shí)現(xiàn)shallowReadonly和isProxy功能示例詳解
這篇文章主要為大家介紹了實(shí)現(xiàn)shallowReadonly和isProxy功能示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-12-12
這篇文章主要介紹了vant如何修改placeholder樣式，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-05-05