JavaScript中的instanceof和typeof常被用来判断一个变量是什么类型的(实例),但它们的使用还是有区别的:

typeof 运算符
返回一个用来表示表达式的数据类型的字符串。

typeof expression ;

expression 参数是需要查找类型信息的任意表达式。

说明
typeof 是一个一元运算符,放在一个运算数之前。

typeof 运算符把类型信息当作字符串返回。typeof 返回值有六种可能: “number” ,“string”, “boolean”, “object” ,“function”, 和 “undefined.”

(而 ECMAScript 有 5 种原始类型(primitive type),即 Undefined、Null、Boolean、Number 和 String。)

注释:

1、我们上面提到了ECMAScript的5种原始类型,在使用typeof操作符时,我们需要特别区分"对象类型"与"对象值"(字面值)的差别。例如Boolean 对象是 Boolean 原始类型的引用类型,而true和false则是Boolean对象的两个可能的对象值。我们可以把 ECMAScript的预定义对象(相对于其他语言中的类)看作是 相应类型的原始值的封装(或包装)。而ECMAScript的所有预定义对象又都是继承于Object对象。因此存在如下情况:

复制代码代码如下:

var testvar= new Number(68);
alert(typeof testvar); //输出  "object"
testvar= 68;
alert(typeof testvar); //输出  "number"

又如:

复制代码代码如下:

function Person(){}
document.write ("<br>typeof(Person):"+typeof(Person)); //function
var person = new Person();
document.write ("<br>typeof(person):"+typeof(person)); //object

注意:从传统意义上来说,ECMAScript 并不真正具有类。事实上,除了说明不存在类,在 ECMA-262 中根本没有出现“类”这个词。ECMAScript 定义了“对象定义”,逻辑上等价于其他程序设计语言中的类。

另外:这些预定义对象覆盖了Object 对象的 ValueOf() 方法,返回其原始值。而这些对象的所有属性和方法都可应用于相应类型的原始值上,因为它们是伪对象。

2、typeof 运算符对于 null 值会返回 "Object"。这实际上是 JavaScript 最初实现中的一个错误,然后被 ECMAScript 沿用了。现在,null 被认为是对象的占位符,从而解释了这一矛盾,但从技术上来说,它仍然是原始值。

提示:

1、值 undefined 并不同于未定义的值。但是,typeof 运算符并不真正区分这两种值。考虑下面的代码:

var oTemp;
alert(typeof oTemp);  //输出 "undefined"
alert(typeof oTemp2);  //输出 "undefined"

前面的代码对两个变量输出的都是 "undefined",即使只有变量 oTemp2 从未被声明过。如果对 oTemp2 使用除 typeof 之外的其他运算符的话,会引起错误,因为其他运算符只能用于已声明的变量上。

2、当函数无明确返回值时,返回的也是值 "undefined",如下所示:

function testFunc() {}
alert(testFunc() == undefined);  //输出 "true"3、类型Null,它只有一个专用值 null,即它的字面量。值 undefined 实际上是从值 null 派生来的,因此 ECMAScript 把它们定义为相等的。

alert(null == undefined);  //输出 "true"
尽管这两个值相等,但它们的含义不同:

undefined 是声明了变量但未对其初始化时赋予该变量的值 或 未声明过的变量(只能用于typeof,但作为赋值目标时编译器会自动将其声明为全局变量)。

null 则用于表示尚未存在的对象(即对象为空,或对象找不到)。如果函数或方法要返回的是对象,那么找不到该对象时,返回的通常是 null。

3、我们可以使用 typeof 来获取一个变量是否存在,如 if(typeof a!="undefined"){alert("ok")},而不要去使用 if(a) 因为如果 a 不存在(未声明)则会出错。

对于 Array,Null 等特殊对象使用 typeof 一律返回 object,这正是 typeof 的局限性。如果我们希望获取一个对象是否是数组,或判断某个变量是否是某个对象的实例则要选择使用instanceof。

instanceof 运算符
在使用 typeof 运算符时采用引用类型存储值会出现一个问题,无论引用的是什么类型的对象,它都返回 "object"。ECMAScript 引入了另一个 Java 运算符 instanceof 来解决这个问题。

instanceof 运算符与 typeof 运算符相似,用于识别正在处理的对象的类型。与 typeof 方法不同的是,instanceof 方法要求开发者明确地确认对象为某特定类型。例如:

var oStringObject = new String("hello world");
alert(oStringObject instanceof String); //输出 "true"
这段代码问的是“变量 oStringObject 是否为 String 对象的实例?”oStringObject 的确是 String 对象的实例,因此结果是 "true"。尽管不像 typeof 方法那样灵活,但是在 typeof 方法返回 "object" 的情况下,instanceof 方法还是很有用的。

instanceof运算符

是一个二元运算符。返回一个 Boolean 值,指出对象是否是特定类的一个实例。

expression  instanceof class

参数

expression  必选项。任意对象表达式。

class 必选项。任意已定义的对象类。

说明
如果 object 是 class 的一个实例,则 instanceof 运算符返回 true 。如果 object不是指定类的一个实例,或者 object 是 null ,则返回 false 。

用于判断一个变量是否某个对象的实例,

如var a=new Array();alert(a instanceof Array);会返回true,同时alert(a instanceof Object)也会返回true;这是因为Array是object的子类。

再如:function test(){};var a=new test();alert(a instanceof test)会返回true。

注意:

关于function 的 arguments,我们大家也许都认为 arguments 是一个 Array,但如果使用 instaceof 去测试会发现 arguments 不是一个 Array 对象,尽管看起来很像。

此外还有类似的情况,例如:

var a=new Array();if (a instanceof Object) alert('Y');else alert('N'); 得'Y'

但 if (window instanceof Object) alert('Y');else alert('N'); 得'N'

所以,这里的 instanceof 测试的 object 是指 js 语法中的 object,不是指 dom 模型对象。

而此时使用 typeof 会有些区别: alert(typeof(window)) 会得 object

引申:JavaScript中的instanceof操作符的原理是什么?

学习js时,了解到在判断js中一个实例是否属于某一种类型时,可以使用instanceof操作符,比如function Person(){}

var person = new Person();  alert(person instanceof Person);//返回true

那么在执行instanceof这个操作时经过了怎样的判断,返回了true/false?

会不会是通过判断Person.prototype与person的内部指针[[prototype]]两者引用是否相同而得出结果的?

其实,凡是能在实例的"原型对象链"中找到该构造函数的prototype属性所指向的原型对象,就返回true。

而prototype根本就不是实例具有的属性(或者说实例的prototype属性为undefined),而是它原型对象中的属性,如果被篡改了,这个判断方法就不能正确返回了。
另外,能不能直接判断 person.constructor == Person来取得想要的结果呢?

我们做个测试,如下JavaScript代码:

复制代码代码如下:

function Person(name,sex){this.name=name;this.sex=sex;}
document.write ("<br>typeof Person:"+typeof Person);
document.write ("<br>typeof Person.prototype:"+typeof Person.prototype);
document.write ("<br>typeof Person.constructor:"+typeof Person.constructor);

var person = new Person();
document.write ("<br><br>var person = new Person();");
document.write ("<br>typeof person:"+typeof person);
document.write ("<br>typeof person.prototype:"+typeof person.prototype);
document.write ("<br>typeof person.constructor:"+typeof person.constructor);

document.write ("<br><br>Function.constructor:"+Function.constructor);
document.write ("<br><br>Function.prototype:"+Function.prototype);

document.write ("<br><br>Person.constructor:"+Person.constructor);
document.write ("<br><br>Person.prototype:"+Person.prototype);

document.write ("<br><br>person.constructor:"+person.constructor);
document.write ("<br><br>person.prototype:"+person.prototype);

输出如下:

typeof Person:function
typeof Person.prototype:object
typeof Person.constructor:function

var person = new Person();
typeof person:object
typeof person.prototype:undefined
typeof person.constructor:function

Function.constructor:function Function() { [native code] }
Function.prototype:function Empty() {}

Person.constructor:function Function() { [native code] }
Person.prototype:[object Object]

person.constructor:function Person(name,sex){this.name=name;this.sex=sex;}
person.prototype:undefined

和Function类似,Number()为Number对象的构造函数,Number()用于将其参数转换为数字number类型,并返回转换结果(若不能转换则返回NaN)。

在JavaScript中constructor较少使用,variable.constructor返回其对象类的构造函数的字符串表示。

那么在JavaScript中判断数据类型时,我们可以使用以下方式来得到其详细数据类型:

if((typeof a=="object") && (a.constructor==Array)){

}

注意:constructor只能对已有变量进行判断,而typeof则可对未声明变量或空对象进行判断(返回undefined)。

JavaScript中instanceof与typeof运算符的用法及区别详细解析的更多相关文章

  1. JavaScript中 null 的 typeof是object

    JavaScript中  null 的 typeof是object

  2. javascript 中的==(相等运算符)与===(等同运算符)比较

    javascript 中的==(相等运算符)与===(等同运算符)比较:(1)==用于一般比较,===用于严格比较,(2)==在比较的时候可以转换数据类型,===严格比较,只要类型不匹配就返回flas ...

  3. JavaScript中instanceof的判断依据

    读jquery源码的时候,发现作者为了让创建jquery对象更容易使用了用函数返回对象的方法 jQuery = function( selector, context ) { return new j ...

  4. [转载]jQuery中wrap、wrapAll和wrapInner用法以及区别

    原文地址:jQuery中wrap.wrapAll和wrapInner用法以及区别作者:伊少君 原文: <ul>   <li title='苹果'>苹果</li>   ...

  5. SQL语句中count(1)count(*)count(字段)用法的区别

    SQL语句中count(1)count(*)count(字段)用法的区别 在SQL语句中count函数是最常用的函数之一,count函数是用来统计表中记录数的一个函数, 一. count(1)和cou ...

  6. JavaScript 中定义变量时有无var声明的区别

    关于JavaScript中定义变量时有无var声明的区别 var a=5; //正确 a=5; //正确 在javascript中,以上两种方法都是定义变量的正确方法.微软的Script56.CHM中 ...

  7. SQL语句中count(1)count(*)count(字段)用法的区别(转)

    SQL语句中count(1)count(*)count(字段)用法的区别 在SQL语句中count函数是最常用的函数之一,count函数是用来统计表中记录数的一个函数, 一. count(1)和cou ...

  8. JavaScript中querySelector()和getElementById()(getXXXByXX)的区别

    在日常开发中,使用JavaScript获取元素的时候,最常用的方法就是document.getElementById(getXXXByXX)方法.但是最近发现有很多地方使用的是querySelecto ...

  9. JavaScript中instanceof运算符的用法以及和typeof的区别

    instanceof : 判断一个对象是否为某一数据类型,或一个变量是否为一个对象的实例:返回boolean类型栗子①: var aColors = ["red", "g ...

随机推荐

  1. Expanding Rods(二分)

    Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 10287   Accepted: 2615 Description When ...

  2. 整合apache+tomcat+keepalived实现高可用tomcat集群

    Apache是一个强大的Web服务器在处理静态页面.处理大量网络客户请求.支持服务的种类以及可配置方面都有优势,高速并且强壮.但是没有JSP/Servlet的解析能力.整合Apache和Tomcat可 ...

  3. 【转】Android JNI编程—JNI基础

    原文网址:http://www.jianshu.com/p/aba734d5b5cd 最近看到了很多关于热补的开源项目——Depoxed(阿里).AnFix(阿里).DynamicAPK(携程)等,它 ...

  4. 搜索(DLX):HDU 3663 Power Stations

    Power Stations Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)To ...

  5. sql server 2008有关SQL的模糊查询

    执行 数据库查询时,有完整查询和模糊查询之分. 一般模糊语句如下: SELECT 字段 FROM 表 WHERE 某字段 Like 条件 其中关于条件,SQL提供了四种匹配模式: 1,%:表示任意0个 ...

  6. Delphi NativeXml用法攻略

    NativeXml用法攻略 NativeXml可以在官网上下载,下载后将文件夹放在指定地方,打开DELPHI在其环境变量中引用NativeXml路径,然后在程序中引用NativeXml单元,我们就可以 ...

  7. 【Android Studio】没有先安装JDK

    如果没有先安装JDK,安装Android Studio的时候回出现下面这个界面: 请参考我整理的博客文章<JDK的下载.安装和配置>,链接:http://www.cnblogs.com/d ...

  8. bithrtree

    #include "stdio.h" #include "stdlib.h" #define OK 1 #define ERROR 0 typedef char ...

  9. 常用Application Server

    综述,我们这里列出的application server应用服务器,主要是对servlet和JSP提供了良好的支持; [resin] [Tomcat] [jboss] community.jboss. ...

  10. win10在安装Oracle11g时出现了:[INS-13001]环境不满足最低要求,及未找到文件 E:\app\xxj\product\11.2.0\dbhome_1\owb\external\oc4j_applications\applications\WFMLRSVCApp.ear

    win10安装Oracle11g碰到的3个问题: 1.win10在安装Oracle11g时出现了:[INS-13001]环境不满足最低要求 2.未找到文件 E:\app\xxj\product\11. ...