thinkphp后端输出浮点数,前端无法计算,结果为NaN的情况分析

数据库约束了数据为decimal(10,2),根据thinkphp的特性,读取数据库是都会转为字符串,但奇怪的地方是,整个计算过程都毫无异常,组合成新数组时,出现了错误,错误如下:

thinkphp后端输出浮点数,前端无法计算,结果为NaN的情况分析

整个数据的精度发生了变化,其实原因不难分析,无非就是计算机对浮点数精度无法把握而已,那么,到底是哪个环节让精度发生了变化呢?

约束新数组

从上面的情况可知,错误是在组合新数组时发生了错误,代码如下:

所以我尝试在组成新数组前,对数据进行二次约束,新的代码如下:

如上处理后,前端得到了正确精度的数据,诧异的是,此刻前端却出了新问题。

无法计算

按上面的方式处理后,前端的计算结果变成了NaN,如下图:

thinkphp后端输出浮点数,前端无法计算,结果为NaN的情况分析

前端的计算公式是:

无论打印c.received_money还是c.receivable_money,均输出正确的结果,偏偏进行相除,变成了NaN。

这时候就需要确认一下,我们前端得到的这个浮点数,数据类型是什么。

打印数据类型发现,我们得到的数据类型是string,所以,问题出在这里,要解决这个问题,只需要将数据转为浮点数即可。

js提供了parseInt()和parseFloat()两个转换函数。前者把值转换成整数,后者把值转换成浮点数。

再次打印,可以看到数据类型变为了number。

真实原因

排查半天后发现,原因在一开始,错误的使用

这是千分位形式的数字呈现方式,默认就是字符串,转为数字,结果会完全错误,结果自然也就错误。

因为是浮点数,在进行储存,转换的过程中,势必会有精度的问题。

解决的办法是,在计算完成后,约束结果为字符串。

这两句代码起到关键作用:

 

原创文章,作者:蓝洛水深,如若转载,请注明出处:https://blog.lanluo.cn/10652

(0)
蓝洛水深的头像蓝洛水深管理员
上一篇 2022年1月19日 下午2:05
下一篇 2022年1月20日 上午11:58

相关推荐

发表回复

登录后才能评论
联系QQ