【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); //=> name color species say 
   if(eh.hasOwnProperty(key)){
  	console.log(key)    //=> name  color
  }   
}

instanceOf与isPrototypeOf简单总结实例

• hasOwnProperty：是用来判断一个对象是否有你给出名称的属性或对象。不过需要注意的是，此方法无法检查该对象的原型链中是否具有该属性，该属性必须是对象本身的一个成员。
• isPrototypeOf：是用来判断要检查其原型链的对象是否存在于指定对象实例中，是则返回true，否则返回false。

function siteAdmin(nickName,siteName){
     this.nickName=nickName;
     this.siteName=siteName;
 }
 siteAdmin.prototype.showAdmin = function() {
     alert(this.nickName+"是"+this.siteName+"的站长!")
 };
 siteAdmin.prototype.showSite = function(siteUrl) {
     this.siteUrl=siteUrl;
     return this.siteName+"的地址是"+this.siteUrl;
 };
 var matou=new siteAdmin("愚人码头","WEB前端开发");
 var matou2=new siteAdmin("愚人码头","WEB前端开发");
 matou.age="30";

 alert(matou.hasOwnProperty("nickName"));//true
 alert(matou.hasOwnProperty("age"));//true
 alert(matou.hasOwnProperty("showAdmin"));//false
 alert(matou.hasOwnProperty("siteUrl"));//false
 alert(siteAdmin.prototype.hasOwnProperty("showAdmin"));//true
 alert(siteAdmin.prototype.hasOwnProperty("siteUrl"));//false
 alert(siteAdmin.prototype.isPrototypeOf(matou))//true
 alert(siteAdmin.prototype.isPrototypeOf(matou2))//true

转载文章

isPrototypeOf、instanceof、hasOwnProperty函数介绍

js中的hasOwnProperty和isPrototypeOf方法