美文网首页
instanceof详解

instanceof详解

作者: 我的天气很好啦 | 来源:发表于2019-02-25 11:21 被阅读0次

instanceof检测的是原型
我们可以用一段代码模拟一下内部执行过程:

instanceof (A,B) = {
    var L = A.__proto__;
    var R = B.prototype;
    if(L === R) {
        //A的内部属性__proto__指向B的原型对象
        return true;
    }
    return false;
}

我们再来看几个例子:

[] instanceof Array; //true
{} instanceof Object;//true
new Date() instanceof Date;//true

function Person(){};
new Person() instanceof Person;

[] instanceof Object; //true
new Date() instanceof Object;//true
new Person instanceof Object;//true

我们发现,虽然 instanceof 能够判断出 [ ] 是Array的实例,但它认为 [ ] 也是Object的实例,从 instanceof 能够判断出 [ ].proto 指向 Array.prototype,而 Array.prototype.proto 又指向了Object.prototype,最终 Object.prototype.proto 指向了null,标志着原型链的结束。因此,[]、Array、Object 就在内部形成了一条原型链.

从原型链可以看出,[] 的 proto 直接指向Array.prototype,间接指向 Object.prototype,所以按照 instanceof 的判断规则,[] 就是Object的实例。依次类推,类似的 new Date()、new Person() 也会形成一条对应的原型链 。因此,instanceof 只能用来判断两个对象是否属于实例关系, 而不能判断一个对象实例具体属于哪种类型。

instanceof 操作符的问题在于,它假定只有一个全局执行环境。如果网页中包含多个框架,那实际上就存在两个以上不同的全局执行环境,从而存在两个以上不同版本的构造函数。如果你从一个框架向另一个框架传入一个数组,那么传入的数组与在第二个框架中原生创建的数组分别具有各自不同的构造函数。

为了解决这个问题, ECMAScript 5 新增了 Array.isArray() 方法。这个方法的目的是最终确定某个值到底是不是数组,而不管它是在哪个全局执行环境中创建的。

支持 Array.isArray()方法的浏览器有 IE9+、 Firefox 4+、 Safari 5+、 Opera 10.5+和 Chrome。

当检测Array实例时, Array.isArray 优于 instanceof,因为Array.isArray能检测iframes.

var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
xArray = window.frames[window.frames.length-1].Array;
var arr = new xArray(1,2,3); // [1,2,3]

// Correctly checking for Array
Array.isArray(arr);  // true
// Considered harmful, because doesn't work though iframes
arr instanceof Array; // false

假如不存在 Array.isArray(),则在其他代码之前运行下面的代码将创建该方法。

if (!Array.isArray) {
  Array.isArray = function(arg) {
    return Object.prototype.toString.call(arg) === '[object Array]';
  };
}

相关文章

  • instanceof 判对象与继承类

    Java 实例 – instanceof 关键字用法 | 菜鸟教程 脚本之家之instanceof用法详解 ins...

  • instanceof详解

    instanceof检测的是原型我们可以用一段代码模拟一下内部执行过程: 我们再来看几个例子: 我们发现,虽然 i...

  • 详解instanceof

    定义(MDN) instanceof运算符用于测试构造函数的prototype属性是否出现在对象的原型链中的任何位...

  • javascript instanceof 详解

    顾名思义,instanceof就是检查某个实例是否是由某个类或其子类实例化出来的(说明一下,类是ES6的说法,而E...

  • this、原型链、继承

    深入详解javascript之delete操作符深入javascript(六):instanceof 运算符重新理...

  • 面试题【Day21】

    本篇绪论: 1,instanceof 2, this 1,instanceof instanceof用于检测构造函...

  • JS 关键字 instanceof 和 isPrototype

    instanceof instanceof用于判断 "对象" 是否是指定构造函数的 "实例" instanceof...

  • instanceof 的原理和实现

    instanceof是怎么判断数据类型的 instanceof是通过原型链判断,A instanceof B表示:...

  • 13. instanceof 的原理

    instanceof 的原理问题一:instanceof 的原理是什么? instanceof可以正确的判断对象的...

  • js中instanceof方法的使用和实现原理

    instanceof方法的定义 MDN上对instanceof方法的定义非常的简洁明,instanceof 运算符...

网友评论

      本文标题:instanceof详解

      本文链接:https://www.haomeiwen.com/subject/qcvsgftx.html