主页 > 专题教程 > javascript > js基础 >
来源:自学PHP网 时间:2018-02-08 10:24 作者: 阅读:次
[导读] 在JavaScript中,每一个函数都有一个prototype(原型)属性,该属性是一个对象,它的作用是使特定类型的所有对象实例可以共享它所包含的属性和方法。...
在JavaScript中,每一个函数都有一个prototype(原型)属性,该属性是一个对象,它的作用是使特定类型的所有对象实例可以共享它所包含的属性和方法。 原型是JavaScript中非常特殊的一个对象,当一个函数创建之后,会随之产生一个原型对象,当通过这个函数的构造函数创建了一个具体的对象之后,在这个具体的对象中,就会有一个属性指向原型。 下面的代码演示了通过原型创建JavaScript对象的方式。使用基于原型的创建可以将属性和方法设置为对象 function Person(){}; Person.prototype.name = "Leon"; Person.prototype.age = 22; Person.prototype.say = fucntion(){ alert(this.name + "," + this.age); } var p1 = new Person(); p1.say(); 在使用原型方法创建类的过程中,原型在内存中会有4种不同的状态。我们仍然以上面创建 // 第一种状态 function Person(){}; // 第二种状态 Person.prototype.name = "Leon"; Person.prototype.age = 22; Person.prototype.say = fucntion(){ alert(this.name + "," + this.age); } // 第三种状态,创建了一个对象之后会有一个_proto_属性指向原型 // 在使用时如果对象内部没有找到该属性,就会去原型中查找 var p1 = new Person(); p1.say(); // 第四种状态 var p2 = new Person(); p2.name = "Ada"; p2.say(); 首先,我们通过 // 第一种状态 function Person(){}; 在内存中会为 接着我们通过原型为 // 第二种状态 Person.prototype.name = "Leon"; Person.prototype.age = 22; Person.prototype.say = fucntion(){ alert(this.name + "," + this.age); } 添加上面的代码后,原型的内存模型结构如下图所示: 此时,通过原型添加的方法和属性都被存储在原型的内存空间中。 接下来,我们完成 // 第三种状态 var p1 = new Person(); p1.say(); 原型内存模型的第三种状态如下图所示: 我们通过 虽然 console.info(Person.prototype.isPrototypeOf(p1)); // 控制台输出:true 在完成p1对象的创建之后,通过p1对象调用了 除了上面的三种状态之外,原型的内存模型还有第四种状态。 如果我们再创建一个 // 第四种状态 var p2 = new Person(); p2.name = "Ada"; p2.say(); 调用上面的代码之后的原型内存模型如下图所示: 当创建对象p2的时候,同样会在内存中为它分配空间,在p2对象的空间中也会有一个 当我们通过 接着我们调用了 需要特别注意的是:原型中的值是不会被替换的,仅仅只是在属性查找时被对象自己空间中的同名属性所覆盖。 以上就是原型内存模型的4种状态,理解这4种状态是掌握原型的关键所在。 |
自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习
京ICP备14009008号-1@版权所有www.zixuephp.com
网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com