继承 - 深度笔记

NoteDeep
原型链继承的问题
function SuperType(){
    this.colors=['a', 'b', 'c'];
}
function SubType(){
}
// 继承
SubType.prototype = new SuperType();

var obj1 = new SubType();
obj1.colors.push('d');   // 此时原型对象上的colors被修改了。subtype的所有实例都会共享这一属性。
alert(obj1.colors); // a,b,c,d

var obj2 = new SubType();
alert(obj2.colors); // a,b,c,d


借用构造函数
call 和 apply可以扩充函数的作用域，调用时用第一个参数替换this
function SuperType() {
  this.colors=['a', 'b', 'c'];
}
function SubType(){
  superType.call(this);
}
var obj1=new SubType();
obj1.colors.push('d');
console.log(obj1.colors); // a,b,c,d

var obj2=new SubType();
console.log(obj2.colors); // a,b,c 
因为new会创建一个新的对象，并且this是指向这个对象的。
当执行call时，又把这个新的对象作为了SuperType的this


组合继承

function SuperType(name) {
  this.name = name;
  this.colors = ['a', 'b', 'c'];
}

SuperType.prototype.sayName = function () {
  alert(this.name);
};

function SubType(name, age) {
  SuperType.call(this, name);
  this.age = age;
}

SubType.prototype = new SuperType();
SubType.prototype.constructor = SubType;
SubType.prototype.sayAge = function () {
  alert(this.age);
};
var obj1 = new SubType('aaa', 10);
obj1.colors.push('d');
alert(obj1.colors); // a,b,c,d
obj1.sayName();   // aaa
obj1.sayAge();    // 10

var obj2 = new SubType('bbb', 20);
alert(obj2.colors); // a,b,c,d
obj2.sayName(); // bbb
obj2.sayAge(); // 20


将原型链和借用构造函数技术组合起来了。利用了两者的优点，既有对象自己的属性，又能共享原型上的方法或者初始属性。

question：
为什么需要这句代码？ SubType.prototype.constructor = SubType;
因为默认情况下, 有 Func.prototype.constructor = Func;

而且Func的实例obj的constructor属性也会从原型中去继承，有obj.constructor = Func.prototype.constructor = Func;

但是，当原型被手动修改时，也就是这句代码执行之后，SubType.prototype = new SuperType();
原本的SubType.prototype.constructor变为了SuperType。而且会导致obj.constructor = SuperType

所以为了确保constructor的正确性，就需要手动修正一下，就需要SubType.prototype.constructor = SubType;  
毕竟obj是SubType的实例，obj.constructor当然需要指向SubType啦。

参考文章：https://blog.csdn.net/chunqiuwei/article/details/22092551
评论列表

评论...