JavaScript 继承模式

我们知道在JavaScript中，对象的继承时依靠原型来进行，那么原型到底是如何进行继承的呢？

如果有关原型的内部不是很清楚的，可以看一下https://blog.csdn.net/weixin_45845042/article/details/106121200

现在让我们来看一下，JavaScript中原型到底是如何进行继承的

function Sub(name,age) {
    this.name = name;
    this.age =age ;
}
function Supper(price) {
    this.price =price;
}
var sub = new Sub("小明",3);
var supper = new Supper("150000");

首先我们利用构造函数定义一个sub对象，和supper对象，他们在堆栈中的情况如图：

从图中，我们可以得到两条已有的原型链：

原型链：

• sub->Sub原型->Object原型

• supper->Supper原型->Object原型

我们要实现的目标是sub继承supper，那么我们目标的原型链是：

​ sub-》supper对象-》Supper原型-》Object原型

一句话来概况原型链继承：

子类的构造函数的显示原型为父类的实例对象

Sub.prototype = new Supper(15000);

这里我认为的核心是：一个类的属性，来源于原型，原型相当于一个对象的模板，往往这个模板是Object，这里如果想要实现继承，其实就是拿一个新的模板去替换原理的模板

这里有学过Java的：可以这么翻译：

public class Sub extends Supper {
}

这里是继承了父类的方法，如果我们想要在父类的基础上，来丰富子类，只需要在原型空间中继续书写子类的属性或者方法

Sub.prototype.setName = function setName(name){
    this.name = name;
}

翻译成Java语言就是在Sub类中继续书写内容，这里就不加赘述了

细心的可能会发现一个问题：那就是Constructor属性，这个属性存在于原型空间中，指向构造器，在上述的图中，Constructor属性指向Supper构造函数，这显然是不合理，因此我们应该加以修正

Sub.prototype.constructor = Sub;

上述的原型链常常是用来实现子类继承父类的方法，而在实际使用时，我们通常会选择使用构造函数来实现子类继承父类的属性，但是这种继承并没有涉及到原型链，并不是真正意义上的继承

function Supper(price) {
    this.price =price;
}
function Sub(name,age) {
    Supper.call(this,15000);
    this.name = name;
    this.age =age ;
}

我们利用构造函数可以很轻松的实现子类继承父类的属性

在实际使用，我们会采用构造函数继承+原型链继承的组合继承方法，来实现子类继承父类

//定义父类的构造函数
function Supper(price) {
    this.price =price;
}
//父类的方法写在原型空间中
Supper.prototype.SpeakSupper= function () {
    console.log("Supper");
}
//子类的构造函数中继承父类的属性
function Sub(name,age) {
    Supper.call(this,15000);
    this.name = name;
    this.age =age ;
}
//子类原型链继承父类
Sub.prototype = new Supper();//这里不需要传递参数，我们只需要继承父类的方法

//定义子类的方法
Sub.prototype.SpeakSub = function () {
    console.log("Sub");
}
//创建子类对象
var sub = new Sub("小明",3);
sub.SpeakSub();//Sub
sub.SpeakSupper();//Supper

我们总结一下组合继承：