前端的你还在用bignumber和decimal做精确计算?来试试这个吧!

357 阅读2分钟

今天发现一个新的npm包,@pinkchen/calc,发现只需要输入对应的公式到函数内部,就可以做到数据的精确计算,其内部也是基于decimal.js的,但真的从易用性和可维护性的角度上解决了前端一直诟病已久的计算问题

@pinkchen/calc

前端精确计算终极解决方案, 精确计算、轻量、便捷、计算公式易维护、集成 Decimal 数学函数,支持自定义函数,一应俱全。

优势

  1. 💪 支持精确计算
  2. 🎈 轻量,体积小
  3. 🚀 便捷,支持 es,cjs,umd
  4. 🔢 集成 Decimal 内部数学函数
  5. ⚒️ 支持自定义函数,全方面满足定制化需求

bignumber.js用法示例

import BigNumber from "bignumber.js";

// 1+(2-3)*4-5/6
BigNumber(1).plus(BigNumber(2).minus(3).times(4)).minus(BigNumber(5).div(6))

上面这种写法,一眼看去,根本无法快速知道其真实的含义是什么。如果遇到需求变更或者问题排查时,也很难把上面的代码转换为标准公式

@pinkchen/calc安装

npm i @pinkchen/calc -S
// or
yarn add @pinkchen/calc
// or
pnpm add @pinkchen/calc
// or
bun add @pinkchen/calc

具体使用

console.log(calc('0.1+0.2')); //0.3
console.log(calc('22.22*22.22')); //493.7284
console.log(calc('(22.22*22.22)')); //493.7284
console.log(calc('22.22/(22.22+22.22)')); //0.5
console.log(calc('a*b', { a: 11, b: 22 })); //242
console.log(calc('aa*bb.bb', { aa: 22, b: 22, bb: { bb: 33 } })); //726
console.log(calc('oo.a+oo.b*(oo.c-oo.d.d*(oo.e.e+oo.ff))', { oo: { a: 1, b: 2, c: 3, d: { d: 4 }, e: { e: 5 }, ff: 6 } })); //-81
console.log(calc('1 + 2 * (3 - 4 * (5 + 6))')); //-81
// 格式化
console.log(calc('2222.22*2222.22', {}, { separator: true })); //4,938,261.7284
console.log(calc('2222.22*2222.22', {}, { digit: 6 })); //4938261.728400
console.log(calc('2222.22*2222.22', {}, { preUnit: '$' })); //$ 4938261.7284
console.log(calc('2222.22*2222.22', {}, { postUnit: 'USD' })); //4938261.7284 USD
console.log(calc('2222.22*2222.22', {}, { percentage: true })); //49382.617284 %
console.log(calc('2222.22*2222.22', {}, { permillage: true })); //4938.2617284 ‰
console.log(
  calc(
    '2222.22*2222.22',
    {},
    {
      separator: true,
      digit: 6,
      preUnit: '达到',
      postUnit: '结丹率',
      percentage: true,
    }
  )
); //达到 49,382.617284 % 结丹率

更新

当前库已经支持decimal.js内置数学函数和自定义函数,可以参考 前端精确计算终极解决方案@pinkchen/calc,也可以直接通过下面的npm地址来查看

npm地址

www.npmjs.com/package/@pi…