您的位置:首页 » 分类: JavaScript » 文章: 你可能不知道的 JavaScript 中数字取整:向上取整,向下取整,四舍五入,舍去小数

你可能不知道的 JavaScript 中数字取整:向上取整,向下取整,四舍五入,舍去小数

小编推荐:掘金是一个高质量的技术社区,从 ECMAScript 6 到 Vue.js,性能优化到开源类库,让你不错过前端开发的每一个技术干货。各大应用市场搜索「掘金」即可下载APP,技术干货尽在掌握..

网上方法很多,标题党一下,勿拍 ^_^!实际开发过程中经常遇到数字取整问题,所以这篇文章收集了一些方法,以备查询。

常用的直接取整方法

直接取整就是舍去小数部分。

1、parseInt()

parseInt() 函数解析一个字符串参数,并返回一个指定基数的整数 (数学系统的基础)。这个估计是直接取整最常用的方法了。

示例:

parseInt("2015nov"),  //2015
parseInt(""),  //NaN
parseInt("0xA"),  //10(十六进制)
parseInt(20.15),  //20
parseInt(-20.15),  //-20
parseInt("070");  //56(八进制数)

更多关于 parseInt() 函数可以查看 MDN 文档

2、Math.trunc()

Math.trunc() 方法会将数字的小数部分去掉,只保留整数部分。

Math.trunc(13.37)    // 13
Math.trunc(42.84)    // 42
Math.trunc(0.123)    //  0
Math.trunc(-0.123)   // -0
Math.trunc("-1.123") // -1
Math.trunc(NaN)      // NaN
Math.trunc("foo")    // NaN
Math.trunc()         // NaN

特别要注意的是:Internet Explorer 不支持这个方法,不过写个Polyfill也很简单:

Math.trunc = Math.trunc || function(x) {
  if (isNaN(x)) {
    return NaN;
  }
  if (x > 0) {
    return Math.floor(x);
  }
  return Math.ceil(x);
};

数学的事情还是用数学方法来处理比较好。

快速的取整方法

除了上面这2个办法,我们可以使用按位运算符来实现数字取整。 所有的按位运算都以带符号的32位整数进行。 使用它们将可以将 float 转换为整数。 但是也存在一些问题,我们可以安全取整的数字范围为 ±2^31−1 即:2147483647,远远小于 Number.MAX_VALUE(1.7976931348623157e + 308)。 下面是一些例子:

1、~~number

双波浪线 ~~ 操作符也被称为“双按位非”操作符。你通常可以使用它作为代替 Math.trunc() 的更快的方法。

console.log(~~47.11)  // -> 47
console.log(~~1.9999) // -> 1
console.log(~~3)      // -> 3
console.log(~~[])     // -> 0
console.log(~~NaN)    // -> 0
console.log(~~null)   // -> 0

失败时返回0,这可能在解决 Math.trunc() 转换错误返回 NaN 时是一个很好的替代。

但是当数字范围超出 ±2^31−1 即:2147483647 时,异常就出现了:

// 异常情况
console.log(~~2147493647.123) // -> -2147473649 🙁

2、number|0

| (按位或) 对每一对比特位执行或(OR)操作。

console.log(20.15|0);          // -> 20
console.log((-20.15)|0);       // -> -20
console.log(3000000000.15|0);  // -> -1294967296 🙁

3、number^0

^ (按位异或),对每一对比特位执行异或(XOR)操作。

console.log(20.15^0);          // -> 20
console.log((-20.15)^0);       // -> -20
console.log(3000000000.15^0);  // -> -1294967296 🙁

4、number<<0

<< (左移) 操作符会将第一个操作数向左移动指定的位数。向左被移出的位被丢弃,右侧用 0 补充。

console.log(20.15 < < 0);     // -> 20
console.log((-20.15) < < 0);  //-20
console.log(3000000000.15 << 0);  // -> -1294967296 🙁

上面这些按位运算符方法执行很快,当你执行数百万这样的操作非常适用,速度明显优于其他方法。但是代码的可读性比较差。还有一个特别要注意的地方,处理比较大的数字时(当数字范围超出 ±2^31−1 即:2147483647),会有一些异常情况。使用的时候明确的检查输入数值的范围。

舍入舍去取整

舍入舍去取整也非常常见,JavaScript 的 Math 对象中有明确的方法支持:

1、四舍五入 Math.round(number)

Math.round() 是 Math 对象中的一个方法,将数值四舍五入为最接近的整数。

console.log(Math.round(20.1));   // -> 20
console.log(Math.round(20.5));   // -> 21
console.log(Math.round(20.9));   // -> 21
console.log(Math.round(-20.1));  // -> -20
console.log(Math.round(-20.5));  // -> -20 注意这里是-20而不是-21
console.log(Math.round(-20.9));  // -> -21

2、向下取整 Math.floor(number)

Math.floor()这个方法取向下最接近的整数。

console.log(Math.floor(20.1));   // -> 20
console.log(Math.floor(20.5));   // -> 20
console.log(Math.floor(20.9));   // -> 20
console.log(Math.floor(-20.1));  // -> -21
console.log(Math.floor(-20.5));  // -> -21
console.log(Math.floor(-20.9));  // -> -21

3、向上取整 Math.ceil(number)

Math.ceil()这个方法取向上最接近的整数。

console.log(Math.ceil(20.1));   // -> 21
console.log(Math.ceil(20.5));   // -> 21
console.log(Math.ceil(20.9));   // -> 21
console.log(Math.ceil(-20.1));  // -> -20
console.log(Math.ceil(-20.5));  // -> -20
console.log(Math.ceil(-20.9));  // -> -20
正文完。下面还有一个推广让最好的人才遇见更好的机会!

互联网行业的年轻人,他们面对着怎样的职业瓶颈、困惑与未来选择?过去,这鲜有人关心。资深的职场人,也多半优先选择熟人去推荐机会。

100offer致力于改变现状,帮互联网行业最好的人才发现更好的机会。使用 100offer.com 或 100offer App ,可以一周内获得中国、美国等数千家优质企业的工作机会。

马上去遇见更好的机会
推广结束

关注亚洲城线上娱乐官方公众号

关注国内外最新最好的前端开发技术干货,获取最新前端开发资讯,致力于打造高质量的前端技术分享公众号

发表评论

电子邮件地址不会被公开。 必填项已用*标注