isPrototypeOf和 instanceof 的区别

Posted yu412

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了isPrototypeOf和 instanceof 的区别相关的知识,希望对你有一定的参考价值。

看了很多关于isPrototypeOf和instanceOf的区别感觉细细理解下来还是MDN上介绍的比较清楚:

他们做同样的事情,两个遍历原型链寻找其中的特定对象

isPrototypeOf() 方法用于测试一个对象是否存在于另一个对象的原型链上。

 
语法:  prototypeObj.isPrototypeOf(object)
参数:  object  在该对象的原型链上搜寻
返回值:  Boolean,表示调用对象是否在另一个对象的原型链上。

描述:isPrototypeOf 方法允许你检查一个对象是否存在于另一个对象的原型链上。

例如,考虑下面的原型链:

function Fee() 
  // . . .


function Fi() 
  // . . .

Fi.prototype = new Fee();

function Fo() 
  // . . .

Fo.prototype = new Fi();

function Fum() 
  // . . .

Fum.prototype = new Fo();
下面创建一个 Fum 实例,检测 Fi.prototype 是否存在于该实例的原型链上。

var fum = new Fum();
. . .

if (Fi.prototype.isPrototypeOf(fum)) 
  // do something safe
 

instanceof 运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性,是一个运算符,它期望两个操作数,一个对象和一个Constructor function,它将测试传递的函数原型属性是否存在于对象的链上(通过[[HasInstance]](V)内部操作,仅在函数对象中可用)。

 
语法: object instanceof constructor

参数: object 要检测的对象. constructor 某个构造函数

描述:instanceof 运算符用来检测 constructor.prototype 是否存在于参数 object 的原型链上。
// 定义构造函数
function C() 
function D() 

var o = new C();

// true,因为 Object.getPrototypeOf(o) === C.prototype
o instanceof C; 

// false,因为 D.prototype不在o的原型链上
o instanceof D; 

o instanceof Object; // true,因为Object.prototype.isPrototypeOf(o)返回true
C.prototype instanceof Object // true,同上

C.prototype = ;
var o2 = new C();

o2 instanceof C; // true

o instanceof C; // false,C.prototype指向了一个空对象,这个空对象不在o的原型链上.

D.prototype = new C(); // 继承
var o3 = new D();
o3 instanceof D; // true
o3 instanceof C; // true
需要注意的是,如果表达式 obj instanceof Foo 返回true,则并不意味着该表达式会永远返回true,因为Foo.prototype属性的值有可能会改变,改变之后的值很有可能不存在于obj的原型链上,这时原表达式的值就会成为false。
另外一种情况下,原表达式的值也会改变,就是改变对象obj的原型链的情况,虽然在目前的ES规范中,我们只能读取对象的原型而不能改变它,但借助于非标准的__proto__魔法属性,是可以实现的。比如执行obj.__proto__ = 之后,obj instanceof Foo就会返回false了。
 

细细品味会发现两者的区别主要是:

也就是说Y instanceof X判断是的是X的prototype是否在Y的原型链上,而我们知道实例的原型链(__proto__)指向的就是其构造函数的prototype,即Y instanceof X判断Y是否是X的一个实例(若Y是X的实例,那他也是X的父类的实例)
而X.isPrototypeOf(Y)判断的是X对象是否在Y的原型链上,同样Y继承X的关系是X对象在Y对象的原型链上,即X.isPrototypeOf(Y)判断X是否继承至Y。

以上是关于isPrototypeOf和 instanceof 的区别的主要内容,如果未能解决你的问题,请参考以下文章

instanceof 和 构造函数

判断关系

回答问题(2019-11-19)

面向对象的一些方法

[Javascript] js的类和对象

JS中isPrototypeOf 和hasOwnProperty 的区别