0.1+0.2不等於0.3,微信小程式雲開發如何解決JavaScript小數計算精度失準的問題

小禿僧 發表於 2022-05-12
JavaScript

先看圖

在這裡插入圖片描述
這個是JavaScript語言自身存在的一個問題。說道這裡不得不提一下網上流傳的JavaScript搞笑圖

在這裡插入圖片描述

我們在使用雲開發來開發微信小程式的時候,會經常遇到JavaScript小數計算精度失準的問題。特別是實現錢包計算的功能。雖然整數計算不會出錯,但總不能要求微信小程式內都是整數計算吧,這不科學。

在這裡插入圖片描述
那麼開發小程式涉及到小數計算的時候,如何防止小數計算精度失準。

其實有很多方法,這裡主要推薦我覺得比較好的解決辦法。就是使用math.js這個npm包來實現計算。

廢話少說,直接上程式碼!!!

建一個calculation雲函式,程式碼如下:

// 雲函式入口檔案
const cloud = require('wx-server-sdk')
const TcbRouter = require('tcb-router'); //雲函式路由
const math = require('mathjs'); //雲函式路由
cloud.init({
  env:''  //填入你的環境ID
})


// 雲函式入口函式
exports.main = async (event, context) => {
      const app = new TcbRouter({
          event
      });
      //乘法
      app.router('multiply', async(ctx) => {
          var value = math.multiply(math.bignumber(event.num1), math.bignumber(event.num2))
          ctx.body = math.round(value,2)  //四捨五入,並且保留2位小數
      });
      //除法
      app.router('divide', async(ctx) => {
          var value = math.divide(math.bignumber(event.num1), math.bignumber(event.num2))
          ctx.body = math.round(value,2)  //四捨五入,並且保留2位小數
      });
      //加法
      app.router('sum', async(ctx) => {
          var value = math.add(math.bignumber(event.num1), math.bignumber(event.num2))
          ctx.body = math.round(value,2)  //四捨五入,並且保留2位小數
      });
      //減法
      app.router('subtract', async(ctx) => {
          var value = math.subtract(math.bignumber(event.num1), math.bignumber(event.num2))
          ctx.body = math.round(value,2)  //四捨五入,並且保留2位小數
      });
      return app.serve();
}

寫完雲函式的程式碼了,記得安裝math.js計算庫和tcb-router雲函式路由的依賴包。

安裝依賴包步驟,右擊名為calculation雲函式資料夾,再點選“在外部終端視窗中開啟”,然後輸入依次輸入命令:npm install mathjs和npm install tcb-router。安裝成功後,點選“上傳並部署:雲端安裝依賴(不上傳node_modules)”即可部署完成雲函式。

前端請求程式碼如下:

      wx.cloud.callFunction({
        name: 'calculation',
        data: {
              $url: "multiply", //雲函式路由引數,示例引數是乘法
              num1:that.data.price,
              num2:that.data.rate,
        },
        success: res => {
              console.log(res.result.value)  //計算結果
        },
        fail(e) {
              console.log(e)
        }
      });

$url這個是填土雲函式路由引數的,上面程式碼的是表示乘法,如果想讓雲函式計算加法,我們可以傳入“add”作為引數即可。

這裡我們使用了雲函式路由,這樣我們可以把加減乘除的演算法都合併到一個雲函式裡,節儉很多程式碼

end