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
}
}
最新文章
- 在应用中嵌入Python:转
- jsp 错误码debug记录与总结
- json返回日期格式化的解决
- Digital Roots 分类: HDU 2015-06-19 22:56 13人阅读 评论(0) 收藏
- Python学习教程(learning Python)--2.2.2 Python全局和局部变量
- Swift学习笔记七
- springMVC框架+POI组件导出Excel
- 【翻译】在Ext JS应用程序中使用自定义图标
- 【Qt编程】基于Qt的词典开发系列<;五>;--无边框窗口的拖动
- 如何给Windows2016新建IIS并建立网站
- 常用MySQL操作(一)
- 「一本通 6.4 例 4」曹冲养猪(CRT)
- Java中isAssignableFrom()方法与instanceof()方法用法
- angular和vue双向数据绑定
- canvas使用3
- 目标跟踪之meanshift---meanshift2
- apache airflow docker 运行简单试用
- Multipath多路径冗余
- Sokect异步连接发送
- [2011WorldFinal]Chips Challenge[流量平衡]
热门文章
- LinkedHashMap为什么是有序的(与put先后顺序一致)
- putty 默认颜色样式修改 for windows
- mysql数据库备份并且实现远程复制
- Java线程创建形式 Thread构造详解 多线程中篇(五)
- [六]JavaIO之 ByteArrayInputStream与ByteArrayOutputStream
- [六] 函数式接口的复合方法示例 predicate 谓词逻辑运算 Function接口 组合运算 比较器 逆序 比较链
- React组件方法中为什么要绑定this
- 使用VBA批量CSV转XLS(97-2003)
- 菜鸟学ASP.NET MVC4入门笔记
- 从零开始学安全(三十一)●kali 输入 msfconsole 启动报错