继承模式发展史
-
传统形式 ---------- 原型链
过多的继承了没用的属性
-
借用构造函数
不能继承借用构造函数的原型 每次构造函数都要多走一个函数
-
共享原型
不能随便的更改在自己的原型
-
圣杯模式
原型链:
Grand.prototype.lastName = "你";
function Grand() {};
var grand = new Grand();
Father.prototype = grand;
function Father() {
this.name = "Woo";
}
var father = new Father();
Son.prototype = father;
function Son() {}
var son = Son();
结果如下:
从头继承到尾,想要的继承了,不想要的也继承了,造成了用法和效率的不好。所以衍生出了下面的放法 ☟
借用构造函数:
function Person(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
function Student(name, age, sex, grade) {
Person.call(this, name, age)
this.sex = sex
}
var student = new Student("你", 12, "女", 3);
运行结果:
视觉上的优化,每次都要调用一次函数。
借用的构造函数全部包含要用的属性,建议用借用构造函数
共享原型:
Father.prototype.lastName = "BU";
function Father() {
}
function Son() {
}
function inherit(Target, Origin) {
Target.prototype = Origin.prototype;
}
inherit(Son, Father)
Son.prototype.sex = 'male';
var son = new Son();
var father = new Father();
构造函数共用一个原型
导致改变自己的原型另一个也改变
执行如下
圣杯模式:
function inherit(Target, Origin) {
function F() {}
F.prototype = Origin.prototype;
Target.prototype = new F();
Target.prototype.constuctor = Target; //把Target的构造函数指向归位
Target.prototype.uber = Origin.prototype; //为了让我们知道Target真正继承自谁
}
代码案例实现:
function inherit(Target, Origin) {
function F() {}
F.prototype = Origin.prototype;
Target.prototype = new F();
Target.prototype.constuctor = Target;
Target.prototype.uber = Origin.prototype;
}
Father.protoptype.lastName = "BuKaiXiu";
function Father() {};
function Son() {};
inherit(son,Father);
Son.prototype.sex = 'male';
var son = new Son();
var father = new Father();
结果: