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判断checkbox(复选框)是否被选中以及全选、反选实现代码
Feb 21 Javascript
javascript中函数作为参数调用的方法
Feb 09 Javascript
jQuery实现Email邮箱地址自动补全功能代码
Nov 03 Javascript
js实现iframe框架取值的方法(兼容IE,firefox,chrome等)
Nov 26 Javascript
jQuery拖拽通过八个点改变div大小
Nov 29 Javascript
深入理解Node.js中的进程管理
Mar 13 Javascript
不得不看之JavaScript构造函数及new运算符
Aug 21 Javascript
10个在JavaScript开发中常遇到的BUG
Dec 18 Javascript
小程序ios音频播放没声音问题的解决
Jul 11 Javascript
vue实现简单的MVVM框架
Aug 05 Javascript
利用JS如何获取form表单数据
Dec 19 Javascript
jQuery三组基本动画与自定义动画操作实例总结
May 09 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中加密解密函数与DES加密解密实例
2014/10/17 PHP
PHP中的正则表达式实例详解
2017/04/25 PHP
window.onload和$(function(){})的区别介绍
2013/10/30 Javascript
js网页实时倒计时精确到秒级
2014/02/10 Javascript
js 触发select onchange事件代码
2014/03/20 Javascript
jQuery实现延迟跳转的方法
2015/06/05 Javascript
jquery+html5时钟特效代码分享(可设置闹钟并且语音提醒)
2020/03/30 Javascript
详解vue-router 2.0 常用基础知识点之router.push()
2017/05/10 Javascript
Node.js编写CLI的实例详解
2017/05/17 Javascript
Vue.js项目模板搭建图文教程
2017/09/20 Javascript
深入理解Promise.all
2018/08/08 Javascript
webpack4+Vue搭建自己的Vue-cli项目过程分享
2018/08/29 Javascript
vuejs 制作背景淡入淡出切换动画的实例
2018/09/01 Javascript
webpack3.0升级4.0的方法步骤
2020/04/02 Javascript
使用JavaScript获取扫码枪扫描得到的条形码的思路代码详解
2020/06/10 Javascript
利用js实现简易红绿灯
2020/10/15 Javascript
Vue ​v-model相关知识总结
2021/01/28 Vue.js
Mac OS X10.9安装的Python2.7升级Python3.3步骤详解
2013/12/04 Python
详解Python装饰器由浅入深
2016/12/09 Python
Python中标准模块importlib详解
2017/04/16 Python
Python实现Pig Latin小游戏实例代码
2018/02/02 Python
python如何读写csv数据
2018/03/21 Python
tensorflow实现简单的卷积神经网络
2018/05/24 Python
浅谈python新式类和旧式类区别
2019/04/26 Python
python3实现在二叉树中找出和为某一值的所有路径(推荐)
2019/12/26 Python
python:解析requests返回的response(json格式)说明
2020/04/30 Python
代办委托书怎样写
2014/04/08 职场文书
《穷人》教学反思
2014/04/08 职场文书
《海伦?凯勒》教学反思
2014/04/17 职场文书
令人印象深刻的自荐信
2014/05/25 职场文书
计算机应用专业自荐信
2014/07/05 职场文书
作风大整顿心得体会
2014/09/10 职场文书
四风问题班子对照检查材料
2014/09/27 职场文书
投资公司董事长岗位职责
2015/04/16 职场文书
导游词之云南丽江-泸沽湖
2019/09/26 职场文书
windows11怎么查看wifi密码? win11查看wifi密码的技巧
2021/11/21 数码科技