JavaScript中判断数据类型的方法总结


Posted in Javascript onMay 24, 2016

typeof
typeof用的比较多的时候,是判断某个全局变量在不在,假如某个页面定义了一个全局变量。假如你做如下判断:

//haorooms是全局变量
if(haorooms!=undefined){
}//js会报错,说"Uncaught ReferenceError: haorooms is not defined"

解决的方法是我们如下写:

if(typeof haorooms!=undefined){
 }

用了typeof之后,就不会报错了!这是typeof的应用之一!

此外,typeof还可以进行数据类型的判断!如下:

var haorooms="string"; console.log(haorooms); //string
var haorooms=1; console.log(haorooms); //number
var haorooms=false; console.log(haorooms); //boolean
var haorooms; console.log(typeof haorooms); //undfined

var haorooms= null; console.log(typeof haorooms); //object
var haorooms = document; console.log(typeof haorooms); //object
var haorooms = []; console.log(haorooms); //object
var haorooms = function(){}; console.log(typeof haorooms) //function  除了可以判断数据类型还可以判断function类型

很明显,对于typeof,除了前四个类型外,null、对象、数组返回的都是object类型;

instanceof
可以用其判断是否是数组。

var haorooms=[];
console.log(haorooms instanceof Array) //返回true

constructor
constructor就是返回对象相对应的构造函数。
判断各种数据类型的方法:

console.log([].constructor == Array);
console.log({}.constructor == Object);
console.log("string".constructor == String);
console.log((123).constructor == Number);
console.log(true.constructor == Boolean);

function employee(name,job,born){
  this.name=name;
  this.job=job;
  this.born=born; }

var haorooms=new employee("Bill Gates","Engineer",1985); 
console.log(haorooms.constructor); //输出function employee(name, jobtitle, born){this.name = name; this.jobtitle = job; this.born = born;}

通过输出haorooms.constructor,可以看出constructor就是返回对象相对应的构造函数。

Object.prototype.toString
前面我们提到了可以运用 constructor 属性来判定物件类型,让我们再来讲讲 Object.protype.toString 这个方法

Object.prototype.toString.apply({}) // "[object Object]"
Object.prototype.toString.apply([]) // "[object Array]"
Object.prototype.toString.apply(NaN)// "[object Number]"
Object.prototype.toString.apply(function(){}) // "[object Function]"

运用这种方式我们可以正确的判断一个变量的基本型态,但是如果是自订类型的话,却无法得知真正的类型,因为结果依然会是 [object Object]

其他
jQuery 也有类型判断的方法,下面是一例

$.isWindow(window) // true

怎么做的呢

core.js#479
isWindow: function( obj ) {
  return obj != null && obj == obj.window;
}

所以开一个这样的 Object:

var fakeWindow;
fakeWindow = {};
fakeWindow.window = fakeWindow;
$.isWindow(fakeWindow) // true

你就骗过他了。

小结
在 JavaScript 中要正确判断类型,当仔细去钻研的时候,真是一件麻烦事,根据不同的情境去设计你的判断式是相当重要的,我们也必须要去思考如何用最简洁的方式判断正确的类型,当然这篇还有很多地方没有介绍到,例如 isPrototypeOf 这个方法,JavaScript 是一个有许多历史包袱的语言,但也是不断的在进步,运用它的时候,要注意,有太多的方式是双面刃,切记要小心运用。

Javascript 相关文章推荐
Jquery实现无刷新DropDownList联动实现代码
Mar 08 Javascript
在模板页面的js使用办法
Apr 01 Javascript
JQuery.get提交页面不跳转的解决方法
Jan 13 Javascript
Node.js与Sails ~项目结构与Mvc实现及日志机制
Oct 14 Javascript
vue.js学习之vue-cli定制脚手架详解
Jul 02 Javascript
手把手教你搭建ES6的开发运行环境
Jul 11 Javascript
详解如何去除vue项目中的#——History模式
Oct 13 Javascript
jQuery插件Validation表单验证详解
May 26 jQuery
详解vue.js下引入百度地图jsApi的两种方法
Jul 27 Javascript
layui数据表格跨行自动合并的例子
Sep 02 Javascript
Vue+Koa2+mongoose写一个像素绘板的实现方法
Sep 10 Javascript
如何手动实现一个 JavaScript 模块执行器
Oct 16 Javascript
JS实现回到页面顶部动画效果的简单实例
May 24 #Javascript
jQuery中借助deferred来请求及判断AJAX加载的实例讲解
May 24 #Javascript
JS 清除字符串数组中,重复元素的实现方法
May 24 #Javascript
原生js的数组除重复简单实例
May 24 #Javascript
实例讲解jQuery中对事件的命名空间的运用
May 24 #Javascript
json传值以及ajax接收详解
May 24 #Javascript
JS获取屏幕高度的简单实现代码
May 24 #Javascript
You might like
生成ubuntu自动切换壁纸xml文件的php代码
2010/07/17 PHP
PHP数据库链接类(PDO+Access)实例分享
2013/12/05 PHP
php实现连接access数据库并转txt写入的方法
2017/02/08 PHP
javascript 表单验证常见正则
2009/09/28 Javascript
一些主流JS框架中DOMReady事件的实现小结
2011/02/12 Javascript
JavaScript中九种常用排序算法
2014/09/02 Javascript
jquery自定义表格样式
2015/11/23 Javascript
js实现tab切换效果
2017/02/16 Javascript
Vue.js之slot深度复制详解
2017/03/10 Javascript
jQuery编写textarea输入字数限制代码
2017/03/23 jQuery
js Date()日期函数浏览器兼容问题解决方法
2017/09/12 Javascript
nodejs操作mongodb的增删改查功能实例
2017/11/09 NodeJs
浅谈使用React.setState需要注意的三点
2017/12/18 Javascript
使用async-validator编写Form组件的方法
2018/01/10 Javascript
关于vue中watch检测到不到对象属性的变化的解决方法
2018/02/08 Javascript
layui table设置前台过滤转义等方法
2018/08/17 Javascript
vue 动态组件(component :is) 和 dom元素限制(is)用法说明
2020/09/04 Javascript
vue 递归组件的简单使用示例
2021/01/14 Vue.js
[05:03]2018DOTA2亚洲邀请赛主赛事首日回顾
2018/04/04 DOTA
[01:06:19]DOTA2-DPC中国联赛定级赛 LBZS vs SAG BO3第二场 1月8日
2021/03/11 DOTA
详解python 字符串和日期之间转换 StringAndDate
2017/05/04 Python
Python编程实现二分法和牛顿迭代法求平方根代码
2017/12/04 Python
Python日志模块logging基本用法分析
2018/08/23 Python
pandas dataframe添加表格框线输出的方法
2019/02/08 Python
Python实现对特定列表进行从小到大排序操作示例
2019/02/11 Python
python3 property装饰器实现原理与用法示例
2019/05/15 Python
python保存字典和读取字典的实例代码
2019/07/07 Python
python数值基础知识浅析
2019/11/19 Python
pycharm无法导入本地模块的解决方式
2020/02/12 Python
python实现打砖块游戏
2020/02/25 Python
详解CSS3选择器:nth-child和:nth-of-type之间的差异
2017/09/18 HTML / CSS
毕业自我评价
2014/02/05 职场文书
嘉宾邀请函
2015/01/31 职场文书
如何写好活动总结
2019/06/21 职场文书
matplotlib画混淆矩阵与正确率曲线的实例代码
2021/06/01 Python
MySQL七种JOIN类型小结
2021/10/24 MySQL