你可能不知道的 JavaScript 中数字取整
网上方法很多,标题党一下,勿拍 ^_^!实际开发过程中经常遇到数字取整问题,所以这篇文章收集了一些方法,以备查询。
常用的直接取整方法
直接取整就是舍去小数部分。
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) // -> -21
2、number|0
| (按位或) 对每一对比特位执行或(OR)操作。
- console.log(20.15|0); // -> 20
- console.log((-20.15)|0); // -> -20
- console.log(3000000000.15|0); //
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
Fundebug提供JavaScript监控,支持所有主流前端框架,微信小程序监控,微信小游戏监控,后端Node.js监控。

您可能感兴趣的
原文链接:http://www.css88.com/archives/8488
你可能不知道的 JavaScript 中数字取整的更多相关文章
- javaScript中小数取整,四种方法的比较
1.parseInt:只取整数位例如:parseInt(3.7) 取整结果为:3parseInt(-1.1) 取整结果为:-1 2.Math.floor :向下去整,取大的整数例如:Math.floo ...
- 闭包----你所不知道的JavaScript系列(4)
一.闭包是什么? · 闭包就是可以使得函数外部的对象能够获取函数内部的信息. · 闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分. · 闭包就 ...
- js值----你所不知道的JavaScript系列(6)
1.数组 在 JavaScript 中,数组可以容纳任何类型的值,可以是字符串.数字.对象(object),甚至是其他数组(多维数组就是通过这种方式来实现的) .----<你所不知道的JavaS ...
- js类型----你所不知道的JavaScript系列(5)
ECMAScirpt 变量有两种不同的数据类型:基本类型,引用类型.也有其他的叫法,比如原始类型和对象类型等. 1.内置类型 JavaScript 有七种内置类型: • 空值(null) • 未定义( ...
- let和const----你所不知道的JavaScript系列(2)
let 众所周知,在ES6之前,声明变量的关键字就只有var.var 声明变量要么是全局的,要么是函数级的,而无法是块级的. var a=1; console.log(a); console.log( ...
- LHS 和 RHS----你所不知道的JavaScript系列(1)
变量的赋值操作会执行两个动作, 首先编译器会在当前作用域中声明一个变量(如果之前没有声明过), 然后在运行时引擎会在作用域中查找该变量, 如果能够找到就会对它赋值.----<你所不知道的Ja ...
- Lodash 严重安全漏洞背后 你不得不知道的 JavaScript 知识
摘要: 详解原型污染. 原文:Lodash 严重安全漏洞背后 你不得不知道的 JavaScript 知识 作者:Lucas HC Fundebug经授权转载,版权归原作者所有. 可能有信息敏感的同学已 ...
- JavaScript 系列--JavaScript一些奇淫技巧的实现方法(三)数字取整,数组求和
一.前言 简短的sleep函数,获取时间戳:https://www.mwcxs.top/page/746.html 数字格式化 1234567890 --> 1,234,567,890:argr ...
- javascript 解决默认取整的坑(目前已知的最佳解决方案)
javascript 解决默认取整的坑(目前已知的最佳解决方案) 复现该问题 js在数字操作时总会取更高精度的结果,例如1234/10结果就是123.4,但是在c或者java中整数除以10的结果还是整 ...
随机推荐
- [前端]Emmet 基本语法快查
Emmet 是一种快速写html的语法,通过几个简单的缩写,就可以拓展成html标签,工作中写html多多少少会有一些,使用的语法都是基础语法,这里总结下最常用的几个,备查. 这个插件支持非常多的ID ...
- Android电话拦截实现以及TelephonyManager监听的取消
由于毕业设计题目涉及到电话拦截这一块.所以鼓捣了一下.遇到了一些问题,总结一下,以免忘记,也希望能帮助其他新人们. 本篇博客目的:实现电话的拦截 会遇到的问题:android studio下AIDL的 ...
- jsp中的tag与tld
转载自: http://www.cnblogs.com/fanzi2009/archive/2010/04/08/1707888.html 在jsp文件中,可以引用tag和tld文件. 1.对于ta ...
- OpenGL Shader Key Points (1)
1. Shader起步 1.1. 可编程管线 仅考虑Vertex shader和fragment shader: 1.2. Shader Object 在编译阶段生成,把shader源代码编译成 ...
- Android 开发中遇到Read-only file system问题解决方案
问题描述: 在往scdcard中复制mp3文件时,复制不成功.查看了一下sdcard里面没有内容,且无法直接在里面创建文件会出现-- read only file system类似的内容提示. ...
- Smali语法汇总(二)
Opcode 操作码(hex) Opcode name 操作码名称 Explanation 说明 Example 示例 0F return vx 返回在vx寄存器的值. 0F00 - return v ...
- rails应用ajax之二:使用rails自身支持
考虑另一种情况: 1. 页面上半部分显示当前的所有用户,页面下半部分是输入新用户的界面: 2. 每当输入新用户时,页面上半部分会动态更新新加用户的内容: 我们还是用ajax实现,不过这次用rails内 ...
- 恶补web之一:html学习(1)
发现以前欠下的web知识太多鸟,只有重头开始好好学吧,恶补第一站就是html知识啦! html指的是超文本标记语言,它不是编程语言,而是一种标记语言;标记语言是一套标记标签(markup tag),h ...
- 使用微服务架构思想,设计部署OAuth2.0授权认证框架
1,授权认证与微服务架构 1.1,由不同团队合作引发的授权认证问题 去年的时候,公司开发一款新产品,但人手不够,将B/S系统的Web开发外包,外包团队使用Vue.js框架,调用我们的WebAPI,但是 ...
- CentOS 7.4上安装mysql 8.0
我的CentOS版本通过从cat /etc/centos-release查看得知 CentOS Linux release 7.4.1708 (Core) 因此需要yum删除mariadb,然后安装m ...