zoukankan      html  css  js  c++  java
  • JavaScript中instanceof与typeof运算符的用法及区别详细解析

    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)。

  • 相关阅读:
    python活力练习Day13
    检测一个字符串在另外一个字符串中的位置
    Python活力练习Day12
    Python多进程与单进程效率对比
    HTML-Note
    Python判断自定义的参数格式是否正确
    图片的灰与彩
    Git常用命令
    Linux 单引号和双引号的区别
    类函数中获取进程池对象的地址
  • 原文地址:https://www.cnblogs.com/bluers/p/3533480.html
Copyright © 2011-2022 走看看