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 相关文章推荐
屏蔽鼠标右键、Ctrl+n、shift+F10、F5刷新、退格键 的javascript代码
Apr 01 Javascript
浅析javascript操作 cookie对象
Dec 26 Javascript
如何使用HTML5地理位置定位功能
Apr 27 Javascript
玩转JavaScript OOP - 类的实现详解
Jun 08 Javascript
AngularJs bootstrap搭载前台框架——基础页面
Sep 01 Javascript
js输入框使用正则表达式校验输入内容的实例
Feb 12 Javascript
form表单序列化详解(推荐)
Aug 15 Javascript
深入浅析javascript继承体系
Oct 23 Javascript
浅谈Vue.js 组件中的v-on绑定自定义事件理解
Nov 17 Javascript
vue-cli开发时,关于ajax跨域的解决方法(推荐)
Feb 03 Javascript
详解微信小程序获取当前时间及日期的方法
Apr 28 Javascript
jQuery中event.target和this的区别详解
Aug 13 jQuery
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
PHP的栏目导航程序
2006/10/09 PHP
php中判断一个字符串包含另一个字符串的方法
2007/03/19 PHP
php源码加密 仿微盾PHP加密专家(PHPCodeLock)
2010/05/06 PHP
分割GBK中文遭遇乱码的解决方法
2013/08/09 PHP
php版阿里云OSS图片上传类详解
2016/12/01 PHP
yii2 url重写并隐藏index.php方法
2018/12/10 PHP
深入剖析JavaScript中的枚举功能
2014/03/06 Javascript
jQuery中dequeue()方法用法实例
2014/12/29 Javascript
Ajax清除浏览器js、css、图片缓存的方法
2015/08/06 Javascript
JavaScript中实现无缝滚动、分享到侧边栏实例代码
2016/04/06 Javascript
IScroll5 中文API参数说明和调用方法
2016/05/21 Javascript
基于NodeJS+MongoDB+AngularJS+Bootstrap开发书店案例分析
2017/01/12 NodeJs
Kotlin学习第一步 kotlin语法特性
2017/05/25 Javascript
IntersectionObserver实现图片懒加载的示例
2017/09/29 Javascript
vue项目中使用lib-flexible解决移动端适配的问题解决
2018/08/23 Javascript
jQuery实现的淡入淡出图片轮播效果示例
2018/08/29 jQuery
使用gulp构建前端自动化的方法示例
2018/12/25 Javascript
详解wepy开发小程序踩过的坑(小结)
2019/05/22 Javascript
[01:19]DOTA2城市挑战赛报名开始 开启你的城市传奇
2018/03/23 DOTA
在Python中封装GObject模块进行图形化程序编程的教程
2015/04/14 Python
Python 列表(List) 的三种遍历方法实例 详解
2017/04/15 Python
CentOS 6.5下安装Python 3.5.2(与Python2并存)
2017/06/05 Python
python绘制圆柱体的方法
2018/07/02 Python
python 实现A*算法的示例代码
2018/08/13 Python
Python DataFrame.groupby()聚合函数,分组级运算
2018/09/18 Python
python实现在函数图像上添加文字和标注的方法
2019/07/08 Python
python处理document文档保留原样式
2019/09/23 Python
python 上下文管理器及自定义原理解析
2019/11/19 Python
python网络编程:socketserver的基本使用方法实例分析
2020/04/09 Python
美国照明、家居装饰和家具购物网站:Bellacor
2017/09/20 全球购物
DogBuddy荷兰:找到你最完美的狗保姆
2019/04/17 全球购物
新加坡一家在线男士皮具品牌:Faire Leather Co.
2019/12/01 全球购物
高中生家长会演讲稿
2014/01/14 职场文书
Golang 如何实现函数的任意类型传参
2021/04/29 Golang
如何在C++中调用Python
2021/05/21 Python
python编程实现清理微信重复缓存文件
2021/11/01 Python