js 判断数据类型的几种方法
判断js中的数据类型有一下几种方法:typeof、instanceof、 constructor、 prototype、 $.type()/jquery.type(),接下来主要比较一下这几种方法的异同。
先举几个例子:
|
1
2
3
4
5
6
|
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
|
1
2
3
4
5
6
|
alert(typeof a) ------------> stringalert(typeof b) ------------> numberalert(typeof c) ------------> objectalert(typeof d) ------------> objectalert(typeof e) ------------> functionalert(typeof f) ------------> function |
其中typeof返回的类型都是字符串形式,需注意,例如:
|
1
2
|
alert(typeof a == "string") -------------> truealert(typeof a == String) ---------------> false |
另外typeof 可以判断function的类型;在判断除Object类型的对象时比较方便。
2、判断已知对象类型的方法: instanceof
|
1
2
3
4
|
alert(c instanceof Array) ---------------> truealert(d instanceof Date)alert(f instanceof Function) ------------> truealert(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:
|
1
2
3
4
5
6
|
function A(){};function B(){};A.prototype = new B(); //A继承自Bvar aObj = new A();alert(aobj.constructor === B) -----------> true;alert(aobj.constructor === A) -----------> false; |
而instanceof方法不会出现该问题,对象直接继承和间接继承的都会报true:
|
1
2
|
alert(aobj instanceof B) ----------------> true;alert(aobj instanceof B) ----------------> true; |
言归正传,解决construtor的问题通常是让对象的constructor手动指向自己:
|
1
2
3
|
aobj.constructor = A; //将自己的类赋值给对象的constructor属性alert(aobj.constructor === A) -----------> true;alert(aobj.constructor === B) -----------> false; //基类不会报true了; |
4、通用但很繁琐的方法: prototype
|
1
2
3
4
5
6
|
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”。
|
1
2
3
4
|
jQuery.type( undefined ) === "undefined"jQuery.type() === "undefined"jQuery.type( window.notDefined ) === "undefined"jQuery.type( null ) === "null" |
如果对象有一个内部的[[Class]]和一个浏览器的内置对象的 [[Class]] 相同,我们返回相应的 [[Class]] 名字。 (有关此技术的更多细节。 )
|
1
2
3
4
5
6
7
8
|
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.9jQuery.type( /test/ ) === "regexp" |
其他一切都将返回它的类型“object”。
通常情况下用typeof 判断就可以了,遇到预知Object类型的情况可以选用instanceof或constructor方法,实在没辙就使用$.type()方法
js 判断数据类型的几种方法的更多相关文章
- JS 判断数据类型的三种方法
说到数据类型,我们先理一下JavaScript中常见的几种数据类型: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Functi ...
- js判断数据类型的四种方法
1.typeof typeof是一个操作符,其右侧跟一个一元表达式,并返回这个表达式的数据类型.返回的结果用该类型的字符串(全小写字母)形式表示,包括number,string,boolean,und ...
- [转]js判断数据类型的四种方法
原文地址:https://www.cnblogs.com/crackedlove/p/10331317.html 1.typeof typeof是一个操作符,其右侧跟一个一元表达式,并返回这个表达式的 ...
- js中判断数据类型的四种方法总结
js中判断数据类型的四种方法 前言 在js中,我们经常需要判断数据的类型,那么哪些方法可以用来判断数据的类型呢?哪种方法判断数据类型最准确呢? 我们来一个个分析: 1.typeof typeof是一个 ...
- javascript 判断数据类型的几种方法
javascript 判断数据类型的几种方法一.typeof 直接返回数据类型字段,但是无法判断数组.null.对象 typeof 1 "number" typeof NaN &q ...
- JS中判断数据类型的几种方法
1⃣️首先我们来了解一下js中的数据类型 1.基本数据类型:Undefined.Null.Boolean.Number.String(值类型) 2.复杂数据类型:Object(引用类型) (值类型和引 ...
- js判断类型的四种方法
typeof:使用typeof可以很方便的判断六种类型:undefined.boolean.string.number.object.function 数组和null会被判断为object类型 ins ...
- 判断数组的方法/判断JS数据类型的四种方法
参考文: 以下 3 个判断数组的方法,请分别介绍它们之间的区别和优劣Object.prototype.toString.call() . instanceof 以及 Array.isArray() h ...
- js中判断数据类型的4中方法
注意: js中数据类型有7种(number, boolean, string, null, undefined, object, Symbol(es6新增)) 原始数据类型: number, stri ...
随机推荐
- 一款效果非常不错的jquery插件 -Lightbox
今天为大家介绍一款非常不错的jquery图片查看插件-Lightbox.这款图片查看插件体验很好,不仅有左右两个小箭头可以浏览上一张和下一张图片,还支持鼠标的左右键浏览上一张和下一张图片.有点类似go ...
- 一款基于jquery的手风琴图片展示效果
今天要给大家分享一款基于jquery的手风琴图片展示效果.这款图片的展示效果鼠标经过前是灰色的,当鼠标经过时图片变大且变为彩色.效果图如下: 在线预览 源码下载 实现的代码. html代码: &l ...
- 设计和开发ETL系统(一)——ETL过程综述
在这部分将按照设计和实现ETL系统的流程展开,将上一个部分的那些子系统按照提取数据.清洗和一致化.向呈现服务器提交以及管理ETL环境等四个方面进行了分类.(是不是说对ETL主要就是掌握这四个方面的内容 ...
- ubuntu 14.04 安装中文输入法
记录Ubuntu 14.04 里面安装中文输入法的过程 先安装如下包 sudo apt-get install ibus sudo apt-get install ibus ibus-clutter ...
- 工作队列workqueue应用
工作队列是另一种将工作推后执行的形式,它可以把工作交给一个内核线程去执行,这个下半部是在进程上下文中执行的,因此,它可以重新调度还有睡眠. 区分使用软中断/tasklet还是工作队列比较简单,如果推后 ...
- Xcode使用介绍
///// 应用程序文件的组织 Product Name:项目名字 Organization Name:组织机构名称 Company Identifier:公司唯一标识符 Bundle Identif ...
- WPF教程五:布局之Canvas面板
Canvas:画布面板 画布,用于完全控制每个元素的精确位置.他是布局控件中最为简单的一种,直接将元素放到指定位置,主要来布置图面.使用Canvas,必须指定一个子元素的位置(相对于画布),否则所有元 ...
- 一个残酷的生鲜O2O之梦
三个年轻人,毕业一年,上海浦东张江开了一家生态有机蔬菜店-稻香麦甜. 首先,这不是一个关于成功励志的故事,相反的,我们走向了悬崖.经营2个月,最终以签字转让结束了实体店. 准备阶段 我,首先辞职,那时 ...
- [R语言统计]频数表
频数表在统计学中是一个非常基本并且重要的概念,我们这里就来讲解它的基本用法. 首先我们需要载入数据,并查看数据的基本信息 install.packages('vcd') #安装vcd包,其中有可以利用 ...
- ADT Android Development Tools
ADT(Android Development Tools)在Eclipse编译IDE环境中,需安装ADT(Android Developer Tools)Plug-in,这是Android在Ecli ...