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 相关文章推荐
许愿墙中用到的函数
Oct 07 Javascript
JavaScript触发器详解
Mar 10 Javascript
Javascript 圆角div的实现代码
Oct 15 Javascript
JavaScript 基于原型的对象(创建、调用)
Oct 16 Javascript
jQuery使用prepend()方法在元素前添加内容用法实例
Mar 26 Javascript
jquery实现表格隔行换色效果
Nov 19 Javascript
JavaScript事件处理的方式(三种)
Apr 26 Javascript
js简单实现调整网页字体大小的方法
Jul 23 Javascript
浅谈JavaScript中变量和函数声明的提升
Aug 09 Javascript
微信小程序switch组件使用详解
Jan 31 Javascript
浅析Angular 实现一个repeat指令的方法
Jul 21 Javascript
js实现文字头像的生成代码
Mar 07 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
php数组声明、遍历、数组全局变量使用小结
2013/06/05 PHP
百万级别知乎用户数据抓取与分析之PHP开发
2015/09/28 PHP
PHP 验证身份证是否合法的函数
2017/02/09 PHP
面向对象的编程思想在javascript中的运用上部
2009/11/20 Javascript
JQuery的一些小应用收集
2010/03/27 Javascript
JavaScript.The.Good.Parts阅读笔记(一)假值与===运算符
2010/11/16 Javascript
从零开始学习jQuery (六) jquery中的AJAX使用
2011/02/23 Javascript
jQuery探测位置的提示弹窗(toolTip box)详细解析
2013/11/14 Javascript
基于JavaScript实现 网页切出 网站title变化代码
2016/04/03 Javascript
JS模拟的Map类实现方法
2016/06/17 Javascript
JS 数字转换为大写金额的简单实例
2016/08/04 Javascript
AngularJS 入门教程之事件处理器详解
2016/08/19 Javascript
JavaScript DOM节点操作实例小结(新建,删除HTML元素)
2017/01/19 Javascript
利用JS实现文字的聚合动画效果
2017/01/22 Javascript
angularjs点击图片放大实现上传图片预览
2017/02/24 Javascript
nodejs构建本地web测试服务器 如何解决访问静态资源问题
2017/07/14 NodeJs
javaScript产生随机数的用法小结
2018/04/21 Javascript
vue-router 源码实现前端路由的两种方式
2018/07/02 Javascript
微信小程序在其他页面监听globalData中值的变化
2019/07/15 Javascript
[34:56]Ti4冒泡赛LGD vs Liquid 1
2014/07/14 DOTA
Python的Flask框架中使用Flask-Migrate扩展迁移数据库的教程
2016/06/14 Python
Python实用技巧之列表、字典、集合中根据条件筛选数据详解
2018/07/11 Python
python实现批量转换图片为黑白
2020/06/16 Python
用python读取xlsx文件
2020/12/17 Python
如何用Python提取10000份log中的产品信息
2021/01/14 Python
Volcom法国官网:美国冲浪滑板品牌
2017/05/25 全球购物
英国最大的LED专业零售商:Led Hut
2018/03/16 全球购物
澳大利亚领先的运动鞋商店:Hype DC
2018/03/31 全球购物
电台实习生求职信
2014/02/25 职场文书
应用数学专业求职信
2014/03/14 职场文书
电子信息工程自荐信
2014/05/26 职场文书
监督检查工作方案
2014/05/28 职场文书
篮球友谊赛通讯稿
2014/10/10 职场文书
奥巴马开学演讲观后感
2015/06/12 职场文书
走进科学观后感
2015/06/18 职场文书
Nginx限流和黑名单配置
2022/05/20 Servers