谈谈JavaScript类型检测
javascript内置的类型检测机制并非完全可靠。比如typeof操作符,并不能准确的判断数据是哪个类型,比如:数组和对象就不能通过typeof来区分。
typeof [] ==="object" ; // true
typeof {} === "object"; // true
但是typeof用来区别对象与基本数据类型时就比较有用了。
基本数据类型检测
由于typeof对所有对象和数组类型返回的都是"object",所以它在区别对象与基本数据类型时才有用。一个值使用typeof操作符可能返回下列某个字符串,注意是字符串:
"undefined"表示这个值未定义
"boolean"表示这个值是布尔值
"string"表示这个值是字符串
"number"表示这个值是数值
"object"表示这个值是对象或null(注意:typeof null 将返回"object",不能准确地判断类型的合法性,因此不能用typeof来检测对象类型。)
"function"表示这个值是函数(注意:Safari第四版在对正则表达式使用typeof操作符时回返回"function",因此很难确定这个值到底是不是函数。)
引用类型检测
JavaScript引用类型有:Object、Array、Date、Error、RegExp、Function、基本包装类型(Boolean类型、Number类型、String类型)、单体内置对象(Global对象、Math对象)等。检测引用类型可以使用 instanceof 和 Object.toString()方法。
instanceof 运算符
instanceof运算符要求其左边的运算数是一个对象,右边的运算数则是对象类的名字。如果该运算符的左边的对象是右边类的一个实例,则返回true,否则返回false。例如:
var d = new Date(); d instanceof Date; // true
d instanceof Object; // true
d instanceof Number ; //false var a = [];
a instanceof Array ; // true
a instanceof Object; // true
a instanceof RegExp; // false
但是利用instanceof 操作符确定某个对象是不是数组会有些问题,例如:
if( value instanceof Array ) {
// do something
}
instanceof 操作符的问题在于,它假定只有一个全局执行环境。如果网页中包含多个框架,那其实就存在两个以上不同的全局执行环境,从而存在两个以上不同的Array构造函数。如果你从一个框架向另一个框架传入一个数组,那么传入的数组与在第二个框架中原生创建的数组就会分别具有各自的不同的构造函数。因此在第二个框架对传入的数组执行 value instanceof Array 就会返回false了,因为构造函数是不一样的。
Object.toString()检测对象类型
在任何值上调用原生的toString()方法,都会返回一个[object nativeConstructorName] 格式的字符串。每个类在内部都会有一个[[Class]]属性,这个属性就指定上述字符串中的构造函数名。例如:
// 检测数组类型
function isArray(value){
return Object.prototype.toString.call(value) == "[object Array]"
} // 检测函数
function isFunction(value){
return Object.prototype.toString.call(value) == "[object Function]"
} // 检测正则表达式
function isRegExp(value){
return Object.prototype.toString.call(value) == "[object RegExp]"
}
注意:对于在IE中以COM对象形式实现的任何函数,isFunction() 都将返回false,因为它们并非原生的JavaScript函数。
jQuery检测对象类型也是用到了toString()方法,查看type()方法的实现可以看到:
//version:jquery-1.11.3 var class2type = {};
// Populate the class2type map
jQuery.each("Boolean Number String Function Array Date RegExp Object Error".split(" "), function(i, name) {
class2type[ "[object " + name + "]" ] = name.toLowerCase();
});
type: function( obj ) {
if ( obj == null ) {
return obj + "";
}
return typeof obj === "object" || typeof obj === "function" ?
class2type[ toString.call(obj) ] || "object" :
typeof obj;
}
通过定义一个class2type对象把所有类型的toString()返回值通过键值对存储起来。在调用type方法时通过toString()方法返回值进行匹配,最后返回检测值的类型。
总结
在区别基本数据类型和对象类型时可以使用typeof运算符,对于对象的类型确定通常使用原生toString()检测,注意Object.prototype.toString() 本身也可能被修改。
以上是JavaScript类型检测的一些基础知识总结,干货不多,望各位大神指教,欢迎留言讨论。
谈谈JavaScript类型检测的更多相关文章
- Javascript类型检测
原地址 http://www.cnblogs.com/fool/archive/2010/10/07/javascrpt.html 开门见山,我们先来看一下代码: var is = function ...
- javascript 类型检测
javascript数据类型分为简单数据类型和复杂数据类型.简单数据类型分为string,number,boolean,defined,null,复杂数据类型为Object.类型检测在写代码可能会非常 ...
- JavaScript类型检测汇总
曾经我以为JavaScript中的类型检测只要使用 typeof 或 instanceof 就可以通通解决.后来我发现我是too young too naive啊!早说过JavaScript是 ...
- JavaScript 类型 检测
前言 ECMAScript中有5种数据类型,分别为Number,Boolean,Null,Undifined和String,以及一种复杂的数据类型Object(由名值对组成,是这门语言所有对象的基础类 ...
- JavaScript类型检测, typeof操作符与constructor属性的异同
*#type.js function Person(name, age) { this.name = name; this.age = age; } var d = {an: 'object'}; v ...
- JavaScript——类型检测
要检测一个变量是否是基本数据类型,可以用 Typeof 操作符.如果我们想知道它是什么类型的对象,我们可以用instanceof 操作符,语法如下所示: result=variable instanc ...
- javascript类型与类型检测
1.javascript类型: 注:包装对象:如"hello".length实际为js为我们隐式创建了一个String临时对象,去调用该对象的length属性,调用过后再将该临时对 ...
- 小结 javascript中的类型检测
先吐槽一下博客园的编辑器,太不好用了,一旦粘贴个表格进来就会卡死,每次都要用html编辑器写,不爽! 关于javascript的类型检测,早在实习的时候就应该总结,一直拖到现在,当时因为这个问题还出了 ...
- JavaScript的三种类型检测typeof , instanceof , toString比较
1.typeof typeof是js的一个操作符,在类型检测中,几乎没有任何用处. typeof 返回一个表达式的数据类型的字符串,返回结果为javascript中的基本数据类型,包括:number. ...
随机推荐
- 配置Hibernate二级缓存时,不能初始化RegionFactory的解决办法
配置Hibernate 二级缓存时,出现以下bug提示: SLF4J: Failed to load class "org.slf4j.impl.StaticLoggerBinder&quo ...
- AndroidManifest.xml配置文件
AndroidManifest.xml启动文件 主activity: <activity android:name="com.example.android01.MainActivit ...
- 在Mac下配置php开发环境:Apache+php+MySql
/private/etc/apache2/httpd.conf 一.启动Apache sudo apachectl start sudo apachectl -v 可以查看到Apache的版本信息 ...
- Linux下通过源码编译安装程序
本文简单的记录了下,在linux下如何通过源码安装程序,以及相关的知识.(大神勿喷^_^) 一.程序的组成部分 Linux下程序大都是由以下几部分组成: 二进制文件:也就是可以运行的程序文件 库文件: ...
- ECharts+百度地图网络拓扑应用
前一篇谈及到了ECharts整合HT for Web的网络拓扑图应用,后来在ECharts的Demo中看到了有关空气质量的相关报表应用,就想将百度地图.ECharts和HT for Web三者结合起来 ...
- 参考例子,学习Func<T, TResult>委托
这些天,开发ASP.NET MVC,其间有查找资料,发现一个全新的Func<T, TResult> 委托.让我们在开发时,节省与简化很多. 在开发过程中,我们需要把一个泛型List< ...
- 【C#】在窗体中水平居中的控件,到了XP下不居中的解决办法
我时不时会遭遇这个操蛋问题,今天得闲研究了一下,解决如下: A.将窗体FormBorderStyle属性改为Fixed系,当然这会导致用户不能拖拉窗口大小,所以你可能需要B计划↓ B.确保在[VS]中 ...
- java的各种类型转换汇总
java类型转换 Integer String Long Float Double Date 1如何将字串 String 转换成整数 int? A. 有两个方法: 1). int i = Intege ...
- DevExpress winform XtraEditor常用控件
最近在公司里面开始使用DevExpress winform的第三方控件进行开发和维护,这里整理一些常用控件的资料以便于后续查看 ComboBoxEdit 这个控件和winform自带的控件差不多,使用 ...
- EntityFramework中几种更改数据的方式
首先声明个实体类,该实体类是EntityFrameWork自动生成的,对应数据表Test结构如下 public partial class Test { public int Id{ get; set ...