先看图



这个是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

0.1+0.2不等于0.3,微信小程序云开发如何解决JavaScript小数计算精度失准的问题的更多相关文章

  1. 微信小程序云开发-从0打造云音乐全栈小程序

    第1章 首门小程序“云开发”课程,你值得学习本章主要介绍什么是小程序云开发以及学习云开发的重要性,并介绍项目的整体架构,真机演示项目功能,详细介绍整体课程安排.课程适用人群以及需要掌握的前置知识.通过 ...

  2. 从0到1构建适配不同端(微信小程序、H5、React-Native 等)的taro + dva应用

    从0到1构建适配不同端(微信小程序.H5.React-Native 等)的taro + dva应用 写在前面 Taro 是一套遵循 React 语法规范的 多端开发 解决方案.现如今市面上端的形态多种 ...

  3. 微信小程序0.11.122100版本新功能解析

    微信小程序0.11.122100版本新功能解析   新版本就不再吐槽了,整的自己跟个愤青似的.人老了,喷不动了,把机会留给年轻人吧.下午随着新版本开放,微信居然破天荒的开放了开发者论坛.我很是担心官方 ...

  4. 微信小程序(原名微信应用号)开发工具0.9版安装教程

    微信小程序全称微信公众平台·小程序,原名微信公众平台·应用号(简称微信应用号) 声明 微信小程序开发工具类似于一个轻量级的IDE集成开发环境,目前仅开放给了少部分受微信官方邀请的人士(据说仅200个名 ...

  5. iKcamp出品|微信小程序|工具安装+目录说明|基于最新版1.0开发者工具初中级教程分享

    iKcamp官网:http://www.ikcamp.com 访问官网更快阅读全部免费分享课程:<iKcamp出品|全网最新|微信小程序|基于最新版1.0开发者工具之初中级培训教程分享>. ...

  6. Fundebug微信小程序错误监控插件更新至1.1.0,新增test()与notifyHttpError()方法

    摘要: 1.1.0新增fundebug.test()和fundebug.notifyHttpError()方法,同时大小压缩至15K. Fundebug是专业的小程序BUG监控服务,可以第一时间为您捕 ...

  7. WordPress版微信小程序3.0版发布

    距离WordPress版微信小程序上一个版本的发布过去了一个月了.在此间,我的工作有些变化,加上正在开发新版本,目前开源版的完善和升级稍稍有些滞后. 虽然这个版本是3.0版,期间有个过渡的2.8版,不 ...

  8. 微信小程序商城开源项目,Weixin-App-Shop 1.0 版本正式发布!!!

    微信小程序商城开源项目,Weixin-App-Shop 1.0 版本正式发布 Weixin-App-Shop 是捷微团队开发的微信小程序商城开源项目,涵盖了微信商城的全部功能,能够快速发布简单易用的小 ...

  9. SpringBoot2.0微信小程序支付多次回调问题

    SpringBoot2.0微信小程序支付多次回调问题 WxJava - 微信开发 Java SDK(开发工具包); 支持包括微信支付.开放平台.公众号.企业微信/企业号.小程序等微信功能的后端开发. ...

随机推荐

  1. spring DAO 有什么用?

    Spring DAO 使得 JDBC,Hibernate 或 JDO 这样的数据访问技术更容易以一 种统一的方式工作.这使得用户容易在持久性技术之间切换.它还允许您在编写 代码时,无需考虑捕获每种技术 ...

  2. 学习zabbix(六)

    实验环境 实验用2到2台机器,实验所用机器系统环境如下,可以看到2台机器的主机名和IP地址 ? 1 2 3 4 5 6 7 8 9 10 [root@linux-node1 ~]# cat /etc/ ...

  3. java后端使用token处理表单重复提交

    保证接口幂等性,表单重复提交 前台解决方案:提交后按钮禁用.置灰.页面出现遮罩后台解决方案:   使用token,每个token只能使用一次1.在调用接口之前生成对应的Token,存放至redis 2 ...

  4. C++ | 虚拟地址空间

    在 x86 32位系统下,进程的虚拟地址空间为 232 (4G)大小,其中在windows系统下4G地址空间中0x00000000-0x7FFFFFFF 是用户地址空间,0x80000000-0xFF ...

  5. C++ | 虚函数产生条件

    虚函数产生的条件 能否成为虚函数主要有以下两种判断依据,如果以下两种条件均满足,则具有成为虚函数的条件. 1.虚函数机制为动多态提供支持,而虚函数表中存放着虚函数的地址.因此虚函数必须是可以取地址的函 ...

  6. 单页应用SPA开发最佳实践

    最近用vue+vue-router做了个单页应用的项目,页面大概有15个左右.积累了一些开发经验在此做一些记录.本文主要从可维护性方面来考虑SPA的开发实践 全站的颜色定义放在一个less或者scss ...

  7. IOS中弹出键盘后出现fixed失效现象的解决方案

    概述 这个问题常出现在移动web开发中聊天或者留言页面的绝对定位输入框上,页面超过屏幕大小时候输入框focus状态下(键盘弹出)绝对定位的元素失效,导致页面滚动时候把定位元素一并带走,体验十分不好,在 ...

  8. turnjs fabricjs canvas 翻书

    最近做了一个翻书效果的项目, 来总结一下实现过程和遇到的一些问题, 供自己以后快速解决问题, 希望也能帮到同样遇到此类问题的同学, 如果有更好的方法,希望你能分享给我git地址 插件: Turn.js ...

  9. AS的不同布局

    AndroidStudio里面支持的布局有挺多种的,但是最最重要的是RelativeLayout(相对布局)和LinearLayout(线性布局),熟练掌握这两种布局也非常够用了,当然还有FrameL ...

  10. java中如果我老是少捕获什么异常,如何处理?

    马克-to-win:程序又一次在出现问题的情况下,优雅结束了.上例中蓝色部分是多重捕获catch.马克-to-win:观察上面三个例子,结论就是即使你已经捕获了很多异常,但是假如你还是少捕获了什么异常 ...