在JavaScript中判断整型的N种方法示例介绍


Posted in Javascript onJune 18, 2014

整数类型(Integer)在JavaScript经常会导致一些奇怪的问题。在ECMAScript的规范中,他们只存在于概念中:

所有的数字都是浮点数,并且整数只是没有一组没有小数的数字。

在这篇博客中,我会解释如何去检查某个值是否为整型。
ECMAScript 5

在ES5中有很多方法你可以使用。有时侯,你可能想用自己的方法:一个isInteger(x)的函数,如果是整型返回true,否则返回false.

让我们看看一些例子。

通过余数检查

你可以使用余数运算(%),将一个数字按1求余,看看余数是不是0。

function isInteger(x) {
  return x % 1 === 0;
}

我喜欢这个方法,因为它非常简单,而且有效。

> isInteger(17)
true
> isInteger(17.13)
false

在操作余数运算时你得小心一点,因为结果取决于第一个数的符号,如果是正的,结果就是正的;否则就是负的。

> 3.5 % 1
0.5
> -3.5 % 1
-0.5

然后,我们也可以检查0,这其实不是一个问题。但问题是:这个方法对非数字也会返回true,因为 % 会将它转换成数字:

> isInteger('')
true
> isInteger('33')
true
> isInteger(false)
true
> isInteger(true)
true

可以通过很简单的类型检查来解决:

function isInteger(x) {
  return (typeof x === 'number') && (x % 1 === 0);
}

通过Math.round() 如果一个数字取整以后还跟之前的值一样,那么它就是整数。在JavaScript中可以通过Math.round()来检查:

function isInteger(x) {
  return Math.round(x) === x;
}

这个方法也不错

> isInteger(17)
true
> isInteger(17.13)
false

它也可以判断非数字,因为Math.round()总是返回数字,并且===只有当类型一样时才返回true.

> isInteger('')
false

如果你想让代码更清晰一点,你可以添加类型检查(就是我们在之前版本做的)。另外,Math.floor()和Math.ceil()可以像Math.round()一样工作。 通过位操作检查 位操作符提供另外一种“取整”的方法:

function isInteger(x) {
  return (x | 0) === x;
}

这个解决方案(跟其它位运算一样)有一个缺陷:它无法处理超过32位的数字。

> isInteger(Math.pow(2, 32))
false

通过parseInt()检查 parseInt()也提供了跟Math.round()类似将数字转换成整型的方法。 让我们看看这个方法为什么不错。

function isInteger(x) {
  return parseInt(x, 10) === x;
}

像Math.round()解决方案一样,它也可以处理非数字的情况,但是它也不能正确地处理所有的整型数字:

> isInteger(1000000000000000000000)
false

为什么?parseInt()在解析整数之前强迫将第一个参数解析成字符串。因此使用这种方法将数字转换成整型不是一个好的选择。

> parseInt(1000000000000000000000, 10)
1
> String(1000000000000000000000)
'1e+21'

就像上面那样,parseInt()在解析'1e+21'时在1处停止处理了,所以它才会返回1. ECMAScript 6 对于Math.round()扔补充,ES6提供了另外一个将数字转换成整型的方法:Math.trunc()。该函数会移除数字的小数部分。

> Math.trunc(4.1)
4
> Math.trunc(4.9)
4
> Math.trunc(-4.1)
-4
> Math.trunc(-4.9)
-4

此外,ECMAScript6不需要去处理检查整数那些琐碎的任务,因为它带有一个内置函数 Number.isInteger()。

Javascript 相关文章推荐
解决jquery中美元符号命名冲突问题
Jan 08 Javascript
js判断变量初始化的三种形式及推荐用的形式
Jul 22 Javascript
轻松学习jQuery插件EasyUI EasyUI实现拖动基本操作
Nov 30 Javascript
JS运动相关知识点小结(附弹性运动示例)
Jan 08 Javascript
jquery对象和DOM对象的任意相互转换
Feb 21 Javascript
JavaScript使用正则表达式获取全部分组内容的方法示例
Jan 17 Javascript
详解angularJS自定义指令间的相互交互
Jul 05 Javascript
js微信分享实现代码
Oct 11 Javascript
解决vue.js this.$router.push无效的问题
Sep 03 Javascript
vue二级菜单导航点击选中事件的方法
Sep 12 Javascript
Vue表单输入绑定的示例代码
Nov 01 Javascript
vue中控制mock在开发环境使用,在生产环境禁用方式
Apr 06 Vue.js
input标签内容改变的触发事件介绍
Jun 18 #Javascript
jQuery控制TR显示隐藏的几种方法
Jun 18 #Javascript
对 jQuery 中 data 方法的误解分析
Jun 18 #Javascript
浅谈 jQuery 事件源码定位问题
Jun 18 #Javascript
js调试系列 源码定位与调试[基础篇]
Jun 18 #Javascript
js调试系列 控制台命令行API使用方法
Jun 18 #Javascript
js调试系列 初识控制台
Jun 18 #Javascript
You might like
咖啡因含量是由谁决定的?低因咖啡怎么来?低因咖啡适合什么人喝
2021/03/06 新手入门
php抓取页面的几种方法详解
2013/06/17 PHP
php动态生成函数示例
2014/03/21 PHP
php使用递归计算文件夹大小
2014/12/24 PHP
简单的php+mysql聊天室实现方法(附源码)
2016/01/05 PHP
php mysql_list_dbs()函数用法示例
2017/03/29 PHP
PHP strripos函数用法总结
2019/02/11 PHP
最佳的addEvent事件绑定是怎样诞生的
2011/10/24 Javascript
ExtJS下 Ext.Direct加载和提交过程排错小结
2013/04/02 Javascript
JS给超链接加确认对话框的方法
2015/02/24 Javascript
关于JS中prototype的理解
2015/09/07 Javascript
jQuery事件用法详解
2016/10/06 Javascript
AngularJS执行流程详解
2017/02/17 Javascript
js es6系列教程 - 基于new.target属性与es5改造es6的类语法
2017/09/02 Javascript
AngularJs 延时器、计时器实例代码
2017/09/16 Javascript
JavaScript数组去重的多种方法(四种)
2017/09/19 Javascript
Node.JS使用Sequelize操作MySQL的示例代码
2017/10/09 Javascript
vue+elementUI实现简单日历功能
2020/09/24 Javascript
python装饰器与递归算法详解
2016/02/18 Python
Python的时间模块datetime详解
2017/04/17 Python
hmac模块生成加入了密钥的消息摘要详解
2018/01/11 Python
python负载均衡的简单实现方法
2018/02/04 Python
OpenCV 模板匹配
2019/07/10 Python
python装饰器的特性原理详解
2019/12/25 Python
pytest fixtures装饰器的使用和如何控制用例的执行顺序
2021/01/28 Python
python UIAutomator2使用超详细教程
2021/02/19 Python
CSS3实现背景透明文字不透明的示例代码
2018/06/25 HTML / CSS
美国性感女装网站:bebe
2017/03/04 全球购物
EntityManager都有哪些方法
2013/11/01 面试题
大学生物业管理求职信
2013/10/24 职场文书
政府个人对照检查材料
2014/08/28 职场文书
运动会搞笑广播稿
2014/10/14 职场文书
医院营销工作计划
2015/01/16 职场文书
公务员个人总结
2015/02/12 职场文书
党员自我评价范文2015
2015/03/03 职场文书
详解Python小数据池和代码块缓存机制
2021/04/07 Python