ES5 继承 构造函数的继承 子类继承父类属性(会出现引用问题) 如果父类自身属性有复杂数据类型,那么还需要进行深拷贝 父类:
function PersonDad.propotype. (){
this.name = name;
this.age = 56;
}
//原型上的方法
PersonDad.propotype.hobby = function(){
console.log("喜欢象棋");
}
//子类:可以继承父类原有属性,但无法直接继承原型上的方法
function Son(...args){
Dad.call(this,...args);//通过改变this指向继承父类属性
this.height = "178cm";//支持组合继承
}
//利用赋值,解决原型的引用问题
function Link(){}; //创建一个新的构造函数
Link.prototype = Dad.prototype; //将父类的原型对象赋值给新构造函数的原型对象
Son.prototype = new Link();//将新构造函数的实例化对象赋值给子类的原型对象
//还需要把子类原型对象里的固有属性constructor重新指向自己
Son.prototype.constructor = Son;
//此时再重新定义原型方法便不会再引起引用问题,不会改变父类原有属性和方法
Son.prototype.hobby = function(){
console.log("喜欢篮球");
}
ES6继承 类的继承 解决了构造函数原型的引用问题,不需要深拷贝,支持组合继承
父类:
class Dad {
constructor(name, age) { //constructor函数,接收子类传的参数,属性直接写再函数体中
this.name = name;
this.age = age;
}
//原型方法需要另外写在函数体外
hobby() {
console.log("喜欢象棋");
}
}
子类:
class Son extends Dad{ //关键字extends
constructor(name,age){ //如果子类没有调用constructor函数,那么子类可以省略super关键字
super(name,age); //子类有 constructor 那么一定需要调用 super 函数 ,super可以用于传参到父类 ;
//super 不能直接使用 ,只能在子类构造函数 或者函数里使用
//super一定需要在使用this之前调用
this.height = "178cm";
}
myhobby(){
super.hobby(); // 调用父类 hobby方法;
}
}