JavaScript中数字的四舍五入和截断

2021-01-07  乐帮网

javascript

数字的舍入和截断是开发人员经常遇到的需求。 这个我们在学校的数学课本中已经学习过了,接触过的概念如:四舍五入。

下面我们就认识一下JavsScript中有关数字小数截断的处理,在JavaScript中有一个内置对象:Math。 顾名思义,它是一个对数字进行数学运算方法的集合。 Math与其他内置全局对象有一点小差异。 Math不是构造函数,这意味着属于它的所有属性和方法都是静态的(意味着它可以通过Math作为对象直接来调用方法)。

舍入与截断

这两种方法之间的差异很小,但要理解非常重要。 两者都是通过舍去小数位来近似数字的方法。 四舍五入以给定的精度使用附近的数字近似一个数字。 它有两种实现方式:向上和向下取数。 四舍五入为向上或者向下取近似。 截断只是舍去。举例如下:

四舍五入
3.14159 ≈ 3.1416

截断
3.14159 ≈ 3.1415


下如你看到的这样,如果你需要精确计算数值那么JavaScript可能不是一个很好的选择,有一些情况根本无法处理,例如:当我们从像素位置中删除小数位以避免反锯齿,这个在浏览器中很难实现。

JavaScript中对数字的舍入和截取

舍入是最JS中常见的处理。 我们可以通过舍入取到最接近的数,向下舍或向上入。 JavaScript中有三种方法可以实现此目的:

Math.round() 四舍五入到最接近的整数(如果分数位等于或大于0.5,则四舍五入)
Math.floor() 向下舍取最最接近的整数
Math.ceil() - 向上入取最最接近的整数

Math.round(3.14159)  // 3
Math.round(3.5)      // 4
Math.floor(3.8)      // 3
Math.ceil(3.2)       // 4

用十进制精度舍入数字需要一些计算。或者我们也可以使用Number中的toFixed()方法。 toFixed()的输出类型是一个字符串,它首先需要将值传递给parseFloat()函数以返回数字然后再处理。 所以使用toFixed()看起来真的很慢。

Math.round(3.14159 * 100) / 100  // 3.14

3.14159.toFixed(2);              // 3.14 returns a string
parseFloat(3.14159.toFixed(2));  // 3.14 returns a number

JavaScript 截断数字

Math.trunc()只是删除所有小数位。 它采用一个参数,该参数是一个数字。 如果参数为正数,则其结果与Math.floor()完全相同。 对于负数,它执行效果与Math.ceil()相同。

Math.trunc(3.14159);   //  3
Math.trunc(-3.14159);  // -3

需要注意的是,浏览器对Math.trunc()的支持不是很好。 它是新ES2015(ES6)规范的一部分。 看一下浏览器支持列表:

Google Chrome >= 38
Firefox >= 25
Internet Explorer >= Nope :(
Opera >= 25
Safari >= 7.1

幸运的是,有一种方法可以在没有ES6支持的情况下代替它(感谢Johny在下面的评论中建议了此解决方案)。 我们可以使用按位运算符来实现相同功能。 但是任然会有一些限制。 所有按位运算都对有符号的32位整数起作用。 由于它需要将浮点数转换为整数。 实际上,这意味着我们可以安全地处理2 ^ 31−1(2 147 483 647),这远远小于Number.MAX_VALUE(1.7976931348623157e + 308)。 对于货币计算而言,这也不太合适。

3.14159 | 0;   //  3
-3.14159 | 0;  // -3

3000000000.1 | 0  // -1294967296

总结汇总

Math.round()-舍入到最接近的整数
Math.floor()-向下舍入为负无穷大
Math.ceil()-向上舍入为正无穷大
Math.trunc()-向上或向下舍入为零(老旧浏览器不支持)

转于:https://pawelgrzybek.com/rounding-and-truncating-numbers-in-javascript/

公众号二维码

关注我的微信公众号
在公众号里留言交流
投稿邮箱:1052839972@qq.com

庭院深深深几许?杨柳堆烟,帘幕无重数。
玉勒雕鞍游冶处,楼高不见章台路。
雨横风狂三月暮。门掩黄昏,无计留春住。
泪眼问花花不语,乱红飞过秋千去。

欧阳修

付款二维码

如果感觉对您有帮助
欢迎向作者提供捐赠
这将是创作的最大动力