链接上一篇的构造函数和原型的代码
function Person(){
this.name = "bella";
this.sex="female";
}
Person.prototype.sayHello = function(){
console.log(this.name +"say hello");
};
function Child(age){
this.age = age;
}
Child.prototype = new Person();
var childOne = new Child(22);
该方法也有一个很明显的缺点，就是实例化子类的时候不能给父类传参。
function Person(name,sex){ //构造函数
this.name = name;
this.sex= sex;
}
Person.prototype.sayHello = function(){ 构造函数原型挂载方法
console.log(this.name +"say hello");
};
function Child(name,age){
this.age = age;
}
Child.prototype = new Person('alex','female');
var childOne = new Child("bella",22);
childOne.sayHello(); // alex say hello,应该是bella say hello
那就结合对象冒充和原型链两种方法实现继承,这种方式称为：组合继承
function Person(name,sex){
this.name = name;
this.sex= sex;
}
Person.prototype.sayHello = function(){
console.log(this.name +" say hello");
};
function Child(name,sex,age){
Person.apply(this,[name,sex]);
this.age = age;
}
Child.prototype = new Person();
var childOne = new Child("bella","female",22);
childOne.sayHello(); // bella say hello
总结：成员变量采用对象冒充，成员方法采用原型链方式
到这里，你会觉得这个方案已经无可挑剔了吗？
答案是这个方案还是可以优化的。通过代码可以看到，Person在使用过程中会被调用两次，一次是Person.apply，一次是New Person()的时候。
上面的问题可以通过“寄生组合式继承”来解决。那什么是寄生组合式继承？
寄生组合式：通过构造函数来继承属性，通过原型链来继承方法。具体实现原理如下：
首先都知道js类是通过原型和构造器实现的，js中将类的方法放在function的prototype里面了，它的每一个实例对象都可以获得该类的方法，因此实现了继承
function Person(name,sex){
this.name = name;
this.sex = sex;
}
Person.prototype.sayHello = function(){
console.log(this.name + "say hello");
}
function Female(age){
this.age = age;
};
//Female也是Person,那么Female怎么去实现继承呢？
实现继承：
Female.prototype == Person.prototype //错误的实现
这种方式只是简单的将Femal的原型指向了Person的原型，即Female和Person指向同一个原型，当子类Female增删改原型方法时，父类Person的原型也会被改变，所以该方法是不可取的。那么应该怎么做呢？
就是让Female的proto属性指向Person的prototype对象，而不是直接把prototype指向Person的prototype。
但是Femal.prototyoe.proto = Person.prototype; //也是不正确的
因为proto不是一个标准的语法，在有些浏览器是获取不到这个属性的。
那么合理的做法应该是：让Female的prototype指向一个obejct,这个object的proto指向Person的prototype
大概实现如下图：
image
那么具体实现是：通过Object.create()克隆一个新的prototype(该方法是在ES5中出现的，之前版本可以通过属性遍历实现浅拷贝)
Female.prototype = Object.create(Person.prototype);
console.log(girl instanceof Female); //false 这里又为什么是false？
这里就还包含了一个问题，就是constructor的指向不对，因为是clone过来的prototype,那么prototype中的constructor还是指向Person()，那么需要把
Femal.construtor = Femal; 这样就彻底实现了继承
一般可以将该实现封装成一个方法
function inherit(superType,subType){
var _prototype = Object.create(superType.prototype);
_prototype.construcotr = subType;
_prototype.prototype = _prototype;
}
那么完整代码：
function inherit(superType, subType) {
var _prototype = Object.create(superType.prototype);
_prototype.construcotr = subType;
subType.prototype = _prototype;
}
function Person(name, sex) {
this.name = name;
this.sex = sex;
};
Person.prototype.sayHello = function() {
console.log(this.name + "say hello");
}
function Female(name, sex, age) {
Person.call(this, name, sex);
this.age = age;
};
//Female也是Person,那么Female怎么去实现继承呢？
// 在继承函数之后写自己的方法，否则会被覆盖
inherit(Person, Female);
Female.prototype.printAge = function() {
console.log(this.age);
};
var fm = new Female('Byron', 'm', 26);
fm.sayHello();
网友评论