js 判断数据类型的几种方法


Posted in Javascript onJanuary 13, 2017

判断js中的数据类型有一下几种方法:typeof、instanceof、 constructor、 prototype、 $.type()/jquery.type(),接下来主要比较一下这几种方法的异同。

先举几个例子:

var a = "iamstring.";
var b = 222;
var c= [1,2,3];
var d = new Date();
var e = function(){alert(111);};
var f = function(){this.name="22";};

1、最常见的判断方法:typeof

alert(typeof a)  ------------> string
alert(typeof b)  ------------> number
alert(typeof c)  ------------> object
alert(typeof d)  ------------> object
alert(typeof e)  ------------> function
alert(typeof f)  ------------> function

其中typeof返回的类型都是字符串形式,需注意,例如:

alert(typeof a == "string") -------------> true
alert(typeof a == String) ---------------> false

另外typeof 可以判断function的类型;在判断除Object类型的对象时比较方便。 

2、判断已知对象类型的方法: instanceof

alert(c instanceof Array) ---------------> true
alert(d instanceof Date)
alert(f instanceof Function) ------------> true
alert(f instanceof function) ------------> false

注意:instanceof 后面一定要是对象类型,并且大小写不能错,该方法适合一些条件选择或分支。   

3、根据对象的constructor判断: constructor

alert(c.constructor === Array) ----------> true
alert(d.constructor === Date) -----------> true
alert(e.constructor === Function) -------> true

注意: constructor 在类继承时会出错

eg:

function A(){};
   function B(){};
   A.prototype = new B(); //A继承自B
   var aObj = new A();
   alert(aobj.constructor === B) -----------> true;
   alert(aobj.constructor === A) -----------> false;

而instanceof方法不会出现该问题,对象直接继承和间接继承的都会报true:

alert(aobj instanceof B) ----------------> true;
   alert(aobj instanceof B) ----------------> true;

言归正传,解决construtor的问题通常是让对象的constructor手动指向自己:

aobj.constructor = A; //将自己的类赋值给对象的constructor属性
   alert(aobj.constructor === A) -----------> true;
   alert(aobj.constructor === B) -----------> false; //基类不会报true了;

4、通用但很繁琐的方法: prototype

alert(Object.prototype.toString.call(a) === ‘[object String]') -------> true;
alert(Object.prototype.toString.call(b) === ‘[object Number]') -------> true;
alert(Object.prototype.toString.call(c) === ‘[object Array]') -------> true;
alert(Object.prototype.toString.call(d) === ‘[object Date]') -------> true;
alert(Object.prototype.toString.call(e) === ‘[object Function]') -------> true;
alert(Object.prototype.toString.call(f) === ‘[object Function]') -------> true;

大小写不能写错,比较麻烦,但胜在通用。

5、无敌万能的方法:jquery.type()

如果对象是undefined或null,则返回相应的“undefined”或“null”。

jQuery.type( undefined ) === "undefined"
jQuery.type() === "undefined"
jQuery.type( window.notDefined ) === "undefined"
jQuery.type( null ) === "null"

如果对象有一个内部的[[Class]]和一个浏览器的内置对象的 [[Class]] 相同,我们返回相应的 [[Class]] 名字。 (有关此技术的更多细节。 )

jQuery.type( true ) === "boolean"
jQuery.type( 3 ) === "number"
jQuery.type( "test" ) === "string"
jQuery.type( function(){} ) === "function"
jQuery.type( [] ) === "array"
jQuery.type( new Date() ) === "date"
jQuery.type( new Error() ) === "error" // as of jQuery 1.9
jQuery.type( /test/ ) === "regexp"

其他一切都将返回它的类型“object”。

通常情况下用typeof 判断就可以了,遇到预知Object类型的情况可以选用instanceof或constructor方法,实在没辙就使用$.type()方法。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
firefox下frameset取不到值的解决方法
Sep 06 Javascript
jquery的ajax()函数传值中文乱码解决方法介绍
Nov 08 Javascript
基于jquery实现的文字淡入淡出效果
Nov 14 Javascript
jquery中map函数与each函数的区别实例介绍
Jun 23 Javascript
jquery幻灯片插件bxslider样式改进实例
Oct 15 Javascript
JS排序方法(sort,bubble,select,insert)代码汇总
Jan 30 Javascript
Backbone View 之间通信的三种方式
Aug 09 Javascript
JS判断输入的字符串是否是数字的方法(正则表达式)
Nov 29 Javascript
webpack HappyPack实战详解
Oct 08 Javascript
ant-design-vue按需加载的坑的解决
May 14 Javascript
使用JavaScript获取Django模板指定键值数据
May 27 Javascript
vue商城中商品“筛选器”功能的实现代码
Jul 01 Javascript
AngularJS 文件上传控件 ng-file-upload详解
Jan 13 #Javascript
BootStrap表单验证实例代码
Jan 13 #Javascript
js实现随机抽选效果、随机抽选红色球效果
Jan 13 #Javascript
bootstrap滚动监控器使用方法解析
Jan 13 #Javascript
微信小程序 页面之间传参实例详解
Jan 13 #Javascript
bootstrap下拉菜单使用方法解析
Jan 13 #Javascript
js数组与字符串常用方法总结
Jan 13 #Javascript
You might like
PHP环境搭建(php+Apache+mysql)
2016/11/14 PHP
Linux服务器下PHPMailer发送邮件失败的问题解决
2017/03/04 PHP
JS在TextArea光标位置插入文字并实现移动光标到文字末尾
2013/06/21 Javascript
JQuery中阻止事件冒泡几种方式及其区别介绍
2014/01/15 Javascript
鼠标拖拽移动子窗体的JS实现
2014/02/25 Javascript
jquery实现鼠标滑过显示提示框的方法
2015/02/05 Javascript
有关jquery与DOM节点操作方法和属性记录
2016/04/15 Javascript
js中setTimeout的妙用--防止循环超时
2017/03/06 Javascript
Vue 项目部署到服务器的问题解决方法
2017/12/05 Javascript
vue 2.8.2版本配置刚进入时候的默认页面方法
2018/09/21 Javascript
在vue中使用axios实现post方式获取二进制流下载文件(实例代码)
2019/12/16 Javascript
jQuery+PHP+Ajax实现动态数字统计展示功能
2019/12/25 jQuery
Scrapy框架使用的基本知识
2018/10/21 Python
python多进程使用及线程池的使用方法代码详解
2018/10/24 Python
Python爬虫实现爬取百度百科词条功能实例
2019/04/05 Python
如何通过雪花算法用Python实现一个简单的发号器
2019/07/03 Python
python如何给字典的键对应的值为字典项的字典赋值
2019/07/05 Python
Python 3 实现定义跨模块的全局变量和使用教程
2019/07/07 Python
用Python从0开始实现一个中文拼音输入法的思路详解
2019/07/20 Python
解决Python命令行下退格,删除,方向键乱码(亲测有效)
2020/01/16 Python
Jupyter notebook设置背景主题,字体大小及自动补全代码的操作
2020/04/13 Python
python tkiner实现 一个小小的图片翻页功能的示例代码
2020/06/24 Python
使用Python爬取小姐姐图片(beautifulsoup法)
2021/02/11 Python
Theory美国官网:后现代都市风时装品牌
2018/05/09 全球购物
美国知名的隐形眼镜电商:Contacts America
2019/11/19 全球购物
方法名是否可以与构造器的名字相同
2012/06/04 面试题
Python面试题:Python是如何进行内存管理的
2014/08/04 面试题
UNIX文件名称有什么规定
2013/03/25 面试题
运动会100米解说词
2014/01/23 职场文书
小学家长会邀请函
2014/01/23 职场文书
班班通项目实施方案
2014/02/25 职场文书
《桥》教学反思
2014/04/09 职场文书
民生工作实施方案
2014/05/31 职场文书
2015年销售工作总结范文
2015/03/30 职场文书
redis实现排行榜功能
2021/05/24 Redis
virtualenv隔离Python环境的问题解析
2022/06/21 Python