1.原型和原型链的继承:
优点:实例是子类的实例,也是父类的实例。父类新增的属性和方法子类都可以访问。
缺点:原型的属性是共享的修改一个属性所有的属性都改变了。创建子类没法向父传参。
//原型和原型链继承
function Par(){
this.a = true;
this.info={
name:"xiaoming",
age:20
}
}
Par.prototype.getInfo=function(){
console.log("父"+ this.info,this.a);
}
function Chi(){}
//父的实例赋值给子类的原型
Chi.prototype = new Par();
let one = new Chi();
console.log(one.info.name); //xiaoming
one.getInfo();
2.构造函数继承:子类构造函数内部调用父类构造函数。使用call/apply将父类的构造函数绑定在子对象上。
优点:子类实例共享引用属性的问题。子类可向父类传参。
缺点:每个子类对象都有自己的执行函数,如果对象多了,内存消耗大。
//构造函数继承
function Parent(msg){
this.info={
name:"aa",
age:10,
msg:msg
}
}
function Child(msg){
this.test="child" //子类属性
Parent.call(this,msg);//继承的体现
}
let a = new Child("参数");
console.log(a.info.name); //aa
3.组合式继承:
原型链继承和构造函数式继承组合
优点:不存在引用属性共享的问题。子类可向父类传递参数。
缺点:子类原型上多余了一份父类的实例。
//组合式继承
function Parent(msg){
this.info={
name:"zhaomi",
age:18,
msg:msg
}
}
Parent.prototype.getInfo=function(){
console.log("原型值"+this.info.name); //zhaomi
console.log(this.info);
}
function Child(msg){
//构造函数继承
Parent.call(this,msg);
}
Child.prototype = new Parent();
let a = new Child("组合式");
console.log(a.getInfo());
4.原型式继承:有一个封装继承过程的函数,用来增强对象的。
优点:不需要单独创建构造函数
缺点:属性会在对象中共享,子类实例不能向父类传参。
//原型式继承
//在构造函数a内部创造一个临时的构造函数B
//a的参数是一个对象,将a的参数绑定在b的原型上,返回一个b的实例。
function creObj(obj){
//1.创建一个临时的构造函数
function Fun(){}
//2.obj绑定到Fun的原型上
Fun.prototype = obj
//3.返回Fun的一个实例
return new Fun()
}
let person = {
name:"zhangmi",
age:20,
like:['骑行','探险'],
showInfo(){
console.log(1,this.name);
}
}
//测试:
let one = new creObj(person);
one.name = "lili";
console.log(2,one); //lili
one.like.push('游泳');
console.log(3,one.like);//['骑行','探险','游泳']
5.寄生式继承:创建对象的方法,封装创建过程的函数,实际的对象
优点:不需要单独创建构造函数
缺点:代码复用性比较差,编写起来比较复杂。
//寄生式继承
//创建对象
function objCopy(obj){
function Fun(){}
Fun.prototype = obj;
return new Fun();
}
//封装过程的函数
function creAno(obj){
//原型式继承
let clone = objCopy(obj);
clone.showName = function(){
console.log(this.name);
}
return clone;
}
let person = {
name:"周周",
age:19,
like:["爱好","爱好1"]
}
let one = creAno(person);
one.like.push("爱好2"); //['爱好', '爱好1', '爱好2']
console.log(one.like);
6.es6中的继承:extends实现继承的
//es6继承
class Parent{
constructor(name){
this.name = name;
this.arr=[1,2,3];
}
}
class Child extends Parent{
constructor(){
super("父级");
this.name ="小小";
}
}
let ar1 = new Child();
let ar2 = new Child();
console.log(ar1,ar2);