JavaScript原型链检测：isPrototypeOf、instanceof与hasOwnProperty区别解析

isPrototypeOf

功能：判定一个对象是否为另一对象的原型，即判断某对象是否处于另一对象的原型链之中

var p = {x:1};//定义一个原型对象
var o = Object.create(p);//使用这个原型创建一个对象
p.isPrototypeOf(o);//=>true：o继承p
Object.prototype.isPrototypeOf(p);//=> true p继承自Object.prototype

示例源自《JavaScript权威指南》，简述如下：每个JavaScript对象均关联原型，且从原型继承属性。由对象字面量构建的对象以Object.prototype为原型，故p继承自Object.prototype，这意味着p的原型链中必然包含Object.prototype。

前文提及的Object.create();方法用于构建新对象，其首个参数指定原型，因此上述生成的o对象的原型即为p；

function Animal(){
    this.species = "动物";
};
var eh = new Animal();
Animal.prototype.isPrototypeOf(eh)//=>true

上述实例借助new操作符构建对象eh，并采用构造函数Animal的prototype属性作为其原型。

结合前述两个示例，调用isPrototypeOf()时存在三种情形

p.isPrototypeOf(o);//=>true
Object.prototype.isPrototypeOf(p);
Animal.prototype.isPrototypeOf(eh)//=>true

归纳如下：利用Object.create()构建的对象，以首个参数作为原型对象字面量构建的对象，以Object.prototype作为原型利用new构建的对象，以构造函数的prototype属性作为原型

instanceof

instanceof运算符要求左操作数为对象，右操作数为类标识。若左操作数是右操作数类的实例，则表达式结果为true，否则为false。

var d = new Date();
d instanceof Date;//=>true  d是Date的实例
d instanceof Object;//=>true 所有对象都是Object的实例

利用instanceof判断对象是否为某类实例时，该判断涵盖对父类的检测。尽管instanceof的右操作数为构造函数，但计算过程实质是检测对象的继承关系。

instanceOf与isPrototypeOf简要对比

var d = new Date();
Date.prototype.isPrototypeOf(d);//=>true
d instanceof Date;//=>true

若Date.prototype是d的原型，则d必然是Date的实例。
其局限在于无法通过对象获取具体类型，仅能检测对象是否属于指定类名
在多窗口及多框架子页面的Web应用中兼容性较差。一个典型例子是instanceof操作符不可靠，不能用于数组检测。

hasOwnProperty

用于检测集合成员的归属关系，判断特定属性是否存在于某对象中。可通过in运算符或hasOwnProperty()方法实现。

in运算符左侧为属性名，右侧为字符串，若对象的自有属性或继承属性包含该属性则返回true。对象的hasOwnProperty()方法用于检测指定名称是否为对象的自有属性，若是继承属性则返回false。

function Animal(){}//定义Animal构造函数
  Animal.prototype = {//定义Animal原型
      species:"动物",
      say:function(){
          console.log('i can say word');
      }
  }
 
  function Cat(name,color){//定义构造函数Cat
　　this.name = name;
　　this.color = color;
}
    var F = function(){};
    F.prototype = Animal.prototype;
    Cat.prototype = new F();
    Cat.prototype.constructor = Cat;//Cat继承Animal 用F空对象作为媒介
 
    var eh = new Cat('lili','white');//实例化对象
 
    console.log('say' in eh)//=>true
    console.log('name' in eh)//=>true
    console.log('color' in eh)//=>true
    console.log('species' in eh)=>true
 
    console.log(eh.hasOwnProperty('say'))=>false  由于say为继承属性  非自有属性
    console.log(eh.hasOwnProperty('species'))=>false 由于species为继承属性  非自有属性
    console.log(eh.hasOwnProperty('name'))=>true
    console.log(eh.hasOwnProperty('color'))=>true
 
    for(var key in eh){
          console.log(key);
      if(eh.hasOwnProperty(key)){
      console.log(key)    //=>species  say name  color
      }  
    }

以上为本文全部内容，期望对各位的学习有所助益，也恳请大家继续支持本站。

JavaScript中isPrototypeOf、instanceof和hasOwnProperty函数的用法详解

isPrototypeOf

instanceof

instanceOf与isPrototypeOf简要对比

hasOwnProperty

实用工具推荐