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 相关文章推荐
javascript针对DOM的应用分析(四)
Apr 15 Javascript
escape函数解决js中ajax传递中文出现乱码问题
Oct 30 Javascript
JavaScript中Cookie操作实例
Jan 09 Javascript
JS实现的新浪微博大厅文字内容滚动效果代码
Nov 05 Javascript
Angular排序实例详解
Jun 28 Javascript
深入理解Node.js中通用基础设计模式
Sep 19 Javascript
jquery 一键复制到剪切板的实例
Sep 20 jQuery
vue实现的组件兄弟间通信功能示例
Dec 04 Javascript
浅谈Vue.js 关于页面加载完成后执行一个方法的问题
Apr 01 Javascript
基于vue+axios+lrz.js微信端图片压缩上传方法
Jun 25 Javascript
在 Vue 中编写 SVG 图标组件的方法
Feb 24 Javascript
JS中的继承操作实例总结
Jun 06 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 日期和时间的处理-郑阿奇(续)
2011/07/04 PHP
解析php入库和出库
2013/06/25 PHP
php读取csv实现csv文件下载功能
2013/12/18 PHP
ThinkPHP查询语句与关联查询用法实例
2014/11/01 PHP
Laravel框架模板继承操作示例
2018/06/11 PHP
javascript实现根据汉字获取简拼
2016/09/25 Javascript
Vue.js快速入门实例教程
2016/10/15 Javascript
100多个基础常用JS函数和语法集合大全
2017/02/16 Javascript
JavaScript实现三级级联特效
2017/11/05 Javascript
nodejs acl的用户权限管理详解
2018/03/14 NodeJs
nodeJs爬虫的技术点总结
2018/05/13 NodeJs
vue-cli3 karma单元测试的实现
2019/01/18 Javascript
vue实现微信获取用户信息的方法
2019/03/21 Javascript
BootstrapValidator验证用户名已存在(ajax)
2019/11/08 Javascript
[01:18:21]EG vs TNC Supermajor小组赛B组败者组第一轮 BO3 第一场 6.2
2018/06/03 DOTA
用Python实现斐波那契(Fibonacci)函数
2016/03/25 Python
pyenv命令管理多个Python版本
2017/03/26 Python
python list删除元素时要注意的坑点分享
2018/04/18 Python
Django ManyToManyField 跨越中间表查询的方法
2018/12/18 Python
Python中sorted()排序与字母大小写的问题
2020/01/14 Python
Django多数据库配置及逆向生成model教程
2020/03/28 Python
Mysql数据库反向生成Django里面的models指令方式
2020/05/18 Python
Python实现查找数据库最接近的数据
2020/06/08 Python
英国最大的经认证的有机超市:Planet Organic
2018/02/02 全球购物
俄罗斯在线购买飞机票、火车票、巴士票网站:Tutu.ru
2020/03/16 全球购物
PHP数据运算类型都有哪些
2013/11/05 面试题
质量月活动策划方案
2014/03/10 职场文书
保护环境建议书300字
2014/05/13 职场文书
应聘护士求职信
2014/07/21 职场文书
2015廉洁自律个人总结
2015/02/14 职场文书
八一建军节慰问信
2015/02/14 职场文书
入党积极分子个人总结
2015/03/02 职场文书
公司团队口号霸气押韵
2015/12/24 职场文书
2019新员工心得体会
2019/06/25 职场文书
Java 在生活中的 10 大应用
2021/11/02 Java/Android
解决redis批量删除key值的问题
2022/03/23 Redis