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 相关文章推荐
解放web程序员的输入验证
Oct 06 Javascript
js格式化时间和js格式化时间戳示例
Feb 10 Javascript
js操作IE浏览器弹出浏览文件夹可以返回目录路径
Jul 14 Javascript
jQuery validate插件submitHandler提交导致死循环解决方法
Jan 21 Javascript
JavaScript事件处理的方式(三种)
Apr 26 Javascript
jQuery弹出下拉列表插件(实现kindeditor的@功能)
Aug 16 Javascript
微信开发 js实现tabs选项卡效果
Oct 28 Javascript
js实现华丽的九九乘法表效果
Mar 29 Javascript
ionic grid(栅格)九宫格制作详解
Jun 30 Javascript
使用validate.js实现表单数据提交前的验证方法
Sep 04 Javascript
React优化子组件render的使用
May 12 Javascript
JS实现移动端可折叠导航菜单(现代都市风)
Jul 07 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
Function eregi is deprecated (解决方法)
2013/06/21 PHP
递归删除一个节点以及该节点下的所有节点示例
2014/03/19 PHP
smarty模板引擎基础知识入门
2015/03/30 PHP
php文件上传类的分享
2017/07/06 PHP
Yii2框架redis基本应用示例
2018/07/13 PHP
laravel-admin select框默认选中的方法
2019/10/03 PHP
Laravel5.1 框架Request请求操作常见用法实例分析
2020/01/04 PHP
Prototype Object对象 学习
2009/07/12 Javascript
腾讯与新浪的通过IP地址获取当前地理位置(省份)的接口
2010/07/26 Javascript
高效的获取当前元素是父元素的第几个子元素
2013/10/15 Javascript
JavaScript splice()方法详解
2020/09/22 Javascript
JavaScript判断表单为空及获取焦点的方法
2016/02/12 Javascript
使用jQuery UI库开发Web界面的简单入门指引
2016/04/22 Javascript
JavaScript鼠标事件,点击鼠标右键,弹出div的简单实例
2016/08/03 Javascript
简单实现JavaScript图片切换效果
2016/11/28 Javascript
vue不操作dom实现图片轮播的示例代码
2019/12/18 Javascript
Vue动态加载图片在跨域时无法显示的问题及解决方法
2020/03/10 Javascript
python实现的udp协议Server和Client代码实例
2014/06/04 Python
Pycharm导入Python包,模块的图文教程
2018/06/13 Python
Python制作exe文件简单流程
2019/01/24 Python
解决pyecharts在jupyter notebook中使用报错问题
2020/04/23 Python
Python爬虫库BeautifulSoup的介绍与简单使用实例
2020/01/25 Python
联想中国官方商城:Lenovo China
2017/10/18 全球购物
Probikekit欧盟:在线公路自行车专家
2019/07/12 全球购物
标准导师推荐信(医学类)
2013/10/28 职场文书
教师节活动主持词
2014/04/02 职场文书
战略性融资合作协议书范本
2014/10/17 职场文书
党建工作整改措施
2014/10/28 职场文书
管理人员岗位职责
2015/02/14 职场文书
故意杀人罪辩护词
2015/05/21 职场文书
党小组推荐意见
2015/06/02 职场文书
2016年村党支部公开承诺书
2016/03/24 职场文书
详解nginx.conf 中 root 目录设置问题
2021/04/01 Servers
详解nodejs内置模块
2021/05/06 NodeJs
Anaconda安装pytorch及配置PyCharm 2021环境
2021/06/04 Python
Spark SQL 2.4.8 操作 Dataframe的两种方式
2021/10/16 SQL Server