主页 > 专题教程 > javascript > js基础 >
来源:自学PHP网 时间:2018-02-08 10:24 作者: 阅读:次
[导读] 本文介绍常用的原型和对象属性的检测方法,以及如何对原型进行重写和原型重写是会遇到的一些问题。...
在上一篇文章中我们介绍了,通过4张图分析了原型在各个阶段的状态。下面我们将首先要介绍一些常用的原型和对象属性的检测方法。我们还是以上一篇文章的 function Person(){}; Person.prototype.name = "Leon"; Person.prototype.age = 22; Person.prototype.say = fucntion(){ alert(this.name + "," + this.age); } var p1 = new Person(); var p2 = new Person(); p2.name = "Ada"; p1.say(); p2.say(); 1、检测某个对象是否是某个函数的原型 alert(Person.prototype.isPrototypeOf(p1)); //true 该方法可以检测p1的原型是否是 2、检测某个对象的constructor alert(p1.constructor == Person); //true 3、检测某个属性是否是自己的属性 alert(p1.hasOwnProperty("name")); //false alert(p2.hasOwnProperty("name")); //true 对象p1在自己的空间中没有 4、通过delete删除自己空间中的属性 delete p2.name; p2.say(); alert(p2.hasOwnProperty("name")); //false 我们可以使用 5、通过 alert("name" in p1); //在原型中有,所以为true alert("name" in p2); //在自己的空间中有,所以为true 如果某个属性在原型和自己的空间中都没有,得到的结果就是 6、自定义方法检测某个属性是否在原型中存在 function hasPrototypeProperty(obj,prop){ return(!obj.hasOwnProperty(prop) && (prop in obj)); } 上面代码中我们自定义了一个检测某个属性是否在原型中存在的方法,可以如下使用这个方法: alert(hasPrototypeProperty(p1,"name")); //true alert(hasPrototypeProperty(p2,"name")); //false 因为p1对象的 如果我们像前面那样编写代码,会有大量的 //重写原型 Person.prototype = { name:"Leon", age:22, say:function(){ alert(this.name+ "," + this.age); } } var p1 = new Person(); p1.say(); 在使用上面的方法对原型进行重写之后,由于原型重写了,而且没有通过 alert(p1.constructor == Person); //false 如果 Person.prototype = { constructor:Person, //手动指定constructor name:"Leon", age:22, say:function(){ alert(this.name+ "," + this.age); } } 在对原型进行重写的时候,我们可能会遇到下面的一些问题。下面我们先来看一段会出现问题的原型重写的代码,然后再对代码中每一个阶段进行内存模型分析。代码如下: // 创建Person类 function Person(){} var p1 = new Person(); //在Person的原型上添加了sayHi()方法 Person.prototype.sayHi = function(){ alert(this.name + "Hi!"); } p1.sayHi(); //输出: undefined:hi! // 对Person原型进行重写 Person.prototype = { constructor:Person, //手动指定constructor name:"Leon", age:22, say:function(){ alert(this.name+ "," + this.age); } } var p2 = new Person(); p2.sayHi(); p2.say();//正确 p1.say();//报错 在上面的代码中,我们首先创建了一个 接着我们创建了p1对象,然后在 var p1 = new Person(); //在Person的原型上添加了sayHi()方法 Person.prototype.sayHi = function(){ alert(this.name + "Hi!"); } p1.sayHi(); //输出: undefined:hi! 注意现在的内存模型,由于在这种状态中,在p1对象自己的空间和 再接下来我们对 // 对Person原型进行重写 Person.prototype = { constructor:Person //手动指定constructor name:"Leon", age:22, say:function(){ alert(this.name+ "," + this.age); } } p1.sayHi(); //输出: undefined:hi! 此时的原型内存模型如下图所示: 原型重写之后,JavaScript会为原型分配一块新的内存, 这时候,如果我们在执行 最后,在原型重写之后,我们创建了对象p2。 var p2 = new Person(); p2.sayHi(); 此时的原型内存模型如下图所示: 新创建的p2对象的 如果此时执行 通过上面的原型内存模型的分析,我们可以知道原型重写位置会直接影响对象的属性和方法,在重写前创建的对象和在重写后创建的对象拥有的属性和方法是不一样的。上面的几张内存模型图一定要时刻谨记在脑海中。 |
自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习
京ICP备14009008号-1@版权所有www.zixuephp.com
网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com