我们在前端开发中会遇到一些数字的计算,比如金额,距离等,所以需要用到JavaScript中的Number类型,特别是一些页面需要展示金额,那必须要很准确的数字。
但在ECMAScript 中最有意思的就是Number类型,Number使用IEEE 754 格式表示整数跟浮点值,JavaScript能准确的计算整数,但存储浮点值使用的内存空间是存储整数值的两倍,所以 ECMAScript 总是想方设法把值转换为整数,所以浮点数计算远不如整数精确,比如
0.1 + 0.2 = 0.30000000000000004
0.3 - 0.1 = 0.19999999999999998
很多同学会用 toFixed或者parseFloat去计算,但还是不够精确。
还有一些可以把需要计算的数字升级(乘以10的n次幂)成计算机能够精确识别的整数,等计算完成后再进行降级(除以10的n次幂),这是大部分变成语言处理精度问题常用的方法。
但是还会遇到一些特殊情况
5.1*100000000000 = 509999999999.99994
35.41 * 100 = 3540.9999999999995
浮点值可以用科学记数法来表示。科学记数法用于表示一个应该乘以 10 的给定次幂的数值(小数点后长度),所以我们可以把数字转换成字符串,然后用indexOf(‘.’)获取小数点的位置,记录一下小数位的长度,用ECMAScript 中科学记数法的格式要求是一个数值(整数或浮点数)后跟一个大 写或小写的字母 e,再加上一个要乘的 10 的多少次幂(小数点后长度)去计算
5.1*100 = 509.99999999999994
5.1e1 = 51
5.1e2 = 510
5.1e11 = 510000000000
35.41*100 = 3540.9999999999995
35.41e2 = 3541
0.1+0.2 = 0.30000000000000004
0.1e1+0.2e1 = 3
3e-1 = 0.3
或者用一些库,比如 number-precision 大小才65.1 kB