Math.js封装工具库（解决前端因为浮点数导致计算错误）

概述

该工具库是基于 mathjs 封装的一个数学计算工具，主要解决 JavaScript 浮点数运算精度问题，提供精确的加减乘除、取模等运算功能，特别适合财务、金融等需要高精度计算的场景。

安装与使用

安装依赖

bash 复制代码

npm install mathjs --save

使用

utils/math.js

js 复制代码

import * as $math from "mathjs";

export const math = {
  add() {
    return comp("add", arguments);
  },
  subtract() {
    return comp("subtract", arguments);
  },
  multiply() {
    return comp("multiply", arguments);
  },
  divide() {
    return comp("divide", arguments);
  },
  mod() {
    return comp("mod", arguments);
  },
  divMod(a, b) {
    const quotient = $math.floor(
      $math.divide($math.bignumber(a), $math.bignumber(b))
    ); // 使用 floor 获取整数部分
    const remainder = $math.mod($math.bignumber(a), $math.bignumber(b));
    return [parseFloat(quotient), parseFloat(remainder)];
    // return {
    //   quotient: parseFloat(quotient),
    //   remainder: parseFloat(remainder),
    // };
  },
  // 处理大数字
  bignumber(string) {
    return $math.bignumber(string).toNumber();
  },
  // 比大小
  compare(a, b) {
    const numA = $math.bignumber(a);
    const numB = $math.bignumber(b);

    if ($math.equal(numA, numB)) {
      return 0; // 相等
    } else if ($math.smaller(numA, numB)) {
      return -1; // a < b
    } else {
      return 1; // a > b
    }
  },
};

function comp(_func, args) {
  let t = $math.chain($math.bignumber(args[0]));

  for (let i = 1; i < args.length; i++) {
    const arg = args[i] || 0;
    t = t[_func]($math.bignumber(arg));
  }
  // 防止超过6位使用科学计数法
  return parseFloat(t.done());
}

// 使用场景
// import { math } from '@/utils/math.js'
// 加法
//    const result  = math.add(2, 3)  // 5
// 减法
//    const result  = math.subtract(3, 2)   // 1
// 乘法
//     const result  = math.multiply(2, 3) // 6
// 除法
//       const result = math.divide(4, 2) // 2
// 除余
// const result = math.mod(10, 3); //1
// 除余方法
//  math.divMod(10, 3);  // 输出: { quotient: 3, remainder: 1 }
// 可以多个
//    const result  = math.multiply(3, 2, 2, 2)   // 24
// 取决于math.js文件里面的命名，PS：中间是逗号

demo.vue

html 复制代码

<template>
  <div>
    <div>除法</div>
    <p>{{ number01 }}</p>
    <p>{{ number1 }}</p>
    <div>乘法</div>
    <p>{{ number02 }}</p>
    <p>{{ number2 }}</p>
    <div>加法</div>
    <p>{{ number03 }}</p>
    <p>{{ number3 }}</p>
    <div>减法</div>
    <p>{{ number04 }}</p>
    <p>{{ number4 }}</p>
    <div>多个计算</div>
    <p>{{ number5 }}</p>
  </div>
</template>

<script>
import { math } from "@/utils/math.js";
export default {
  data() {
    return {
      number1: 0,
      number01: 0,
      number02: 0,
      number2: 0,
      number03: 0,
      number3: 0,
      number04: 0,
      number4: 0,
      number5: 0,
    };
  },
  mounted() {
    this.divide();
    this.multiply();
    this.add();
    this.subtract();
    this.multiplys();
  },
  methods: {
    divide() {
      this.number01 = 6.1 / 0.1; // 60.99999999999999
      this.number1 = math.divide(6.1, 0.1); // 61
    },
    multiply() {
      this.number02 = 23 * 2.4; // 55.199999999999996
      this.number2 = math.multiply(23, 2.4); // 55.2
    },
    add() {
      this.number03 = 0.1 + 0.2; // 0.30000000000000004
      this.number3 = math.add(0.1, 0.2); // 0.3
    },
    subtract() {
      this.number04 = 0.8 - 0.7; // 0.10000000000000009
      this.number4 = math.subtract(0.8, 0.7); // 0.1
    },
    multiplys() {
      this.number5 = math.multiply(3, 2, 2, 2); // 24
    },
  },
};
</script>