一、理解prototype
我们创建的每一个函数都有一个prototype属性,这个属性是一个指向对象的指针。
构建对象中有一种模式叫做原型模式,意思是将对象实例所不可共享的属性及方法定义在构造函数中,而将可共享的属性及方法放在原型对象中,也就是prototype指向的对象中。以下是用原型模式创建的一个对象:
01.<script>02.function person(name, age){03. this.name = name;04. this.age = age;05.}06.person.prototype = {07. sayName: function(){08. console.log(this.name);09. }10.};11.var p1 = new person("sulao", 30);12.p1.sayName(); //sulao13.var p2 = new person("merci", 35);14.p2.sayName(); //merci15.</script>
这里我将name、age属性定义在构造函数中,将sayName方法定义在原型中。所以p1和p2对象实例的内存空间里面各有一份name和age,但是它们却共享一份sayName方法,意思是它们调用的sayName方法是同一个。
试想如果我们不用prototype,而是直接将sayName写进构造函数呢?
那么p1和p2中将各有一份sayName,这样浪费内存空间,所以用prototype的好处之一:提高了代码的复用性,减少内存。
在了解原型对象的同时我们还有一个小知识要明白:每当代码读取一个对象属性的时候会执行一次搜索,搜索目标是给定名字的属性,搜索路径为:
对象实例本身---->原型对象---->对象所继承的父类对象---->父类对象原型...---->原型链末端
二、prototype的注意点
1、不可变性:尽管prototype是共享的,但不能通过对象实例重写原型中的值,但是可以由对象统一改。通俗一点:只能爸爸统一改,不能儿子改。(这也和类型有关系,孩子不能改变基本类型的值,但是可以改变对象,比如数组)
基本类型:
01.<script>02.function person(){}03.person.prototype = {04. num : 005.};06.var p1 = new person();07.var p2 = new person();08.p1.num++;09.p2.num; //010.</script>
非基本类型:
01.<script>02.function person(){}03.person.prototype = {04. num : [1,2,3]05.};06.var p1 = new person();07.var p2 = new person();08.p1.num[2] = 8;09.p2.num; // [1, 2, 8]10.</script>
2、同名覆盖性:如果我们在实例中添加了一个与原型属性同名的属性,那么该属性会创建到对象实例中并且会覆盖掉原型中的相应属性。
3、使用对象字面量创建原型方法,会切断之前的链而重写原型链
01.<script>02.function person(name){03. this.name = name;04.}05.person.prototype = {06. sayName: function(){07. console.log(this.name);08. }09.};10.var p1 = new person("sulao");11.person.prototype = {12. age: 2013.};14.p1.sayName(); //sulao15.p1.age; //undefined16.var p2 = new person("merci");17.p2.sayName(); //error18.p2.age; //2019.</script>
因为prototype指针指向了一个新的对象,切断了构造函数与之前的prototype旧对象的联系,然而p1的prototype指针指向的依旧是旧对象。而新创建的实例p2指向的prototype新对象。
三、归纳
prototype的用法:构造函数模型用于定义实例的属性,而原型模型用于定义方法和共享的属性。
内容版权声明:除非注明,否则皆为本站原创文章。
转载注明出处:https://sulao.cn/post/87
评论列表