js实现继承的4种基本方式详解

在es6之前，js创建对象都需要通过函数，如何实现继承成为一个问题。目前有很多人已经给出了自己的解决方案，但由于没有统一的定义，导致相同方式有多个名称、一种方式有多种变体。本文总结了4种最基本的方式，没有遗漏的话，其他方式应该就是下面四种方式的变体或者重命名。欢迎各位读者在评论区补充没有提及的基本方式。

需要强调的是，在js实现继承的过程中，父类或者子类的属性和方法是直接定义在原型上还是定义在实例上并不重要，不能作为划分基本方式的标准，具体的定义方式应该属于js创建对象方式的划分标准

1.原型链继承

原理

将父类作为子类的原型，则子类的原型可以访问父类原型上的属性和方法，以及父类构造函数中复制的属性和方法

步骤

//声明父类构造函数
function father(){
    //定义实例的属性与方法
    this.key=value
}
//定义原型添加属性、方法
father.prototype.key=value
//声明子类
function orange(){.....}
//继承父类
orange.prototype=new father()

2.构造函数式继承

原理

通过在子类的构造函数中使用call/apply执行父类构造函数

步骤

//声明父类
function father(){......}
//声明子类
function orange(){
    father.call(this)   
}

3.实例继承

原理

对类式继承的封装，过渡对象相当于子类

步骤

//声明父类
function father(){......}
//声明子类
function orange() {  
    let instance=new father();
    instance.key=value;
    return instance;
} 

注意

实例是父类的实例

4.拷贝继承

原理

利用循环，将父类的属性、方法复制到子类上

步骤

//声明父类
function father(){......}
//声明子类并乘机拷贝父类属性、方法
function oranget(){
    let me=new father();
    for(let n in me){
        orange.prototype[n]=me[n];
        //或者 this[n]=me[n]
    }
}

注意

不能获取父类不可枚举属性