JavaScript 中的 6 种继承方式

1. 原型链继承

通过将一个类的实例赋值给另一个类的原型来实现继承。子类将继承父类的所有属性和方法。在一个子类实例上修改继承的父类的基础属性值，不会影响到其他子类实例。但是，在一个子类实例上修改继承父类的引用属性值，其他子类实例的值也会跟着改变。

function Parent() {
  this.name = 'Parent';
}

Parent.prototype.sayHello = function() {
  console.log('Hello, I am ' + this.name);
}

function Child() {
  this.name = 'Child';
}

Child.prototype = new Parent();

var child = new Child();
child.sayHello(); // 输出：Hello, I am Child

优点：

• 子类实例可以访问父类的属性和方法。

缺点：

• 所有子类的实例共享父类的属性和方法，如果在一个子类实例上修改继承父类的引用属性值，其他子类实例的值也会跟着改变。

2. 构造函数继承

使用父类的构造函数来创建子类的实例。通过使用 call 和 apply 方法，将父类的属性和方法绑定到子类的实例上。这种方式可以避免原型链继承的问题，每个实例都有自己的属性和方法，但是无法继承父类原型上的属性和方法。

function Parent() {
  this.name = 'Parent';
}

Parent.prototype.sayHello = function() {
  console.log('Hello, I am ' + this.name);
}

function Child() {
  Parent.call(this);
  this.name = 'Child';
}

var child = new Child();
child.sayHello(); // 报错：child.sayHello is not a function

优点：

• 每个实例都有自己的属性和方法，不会共享。

缺点：

• 无法继承父类原型上的属性和方法，只是继承了父类的构造函数。

3. 组合继承

结合原型链继承和构造函数继承的方式。通过调用父类的构造函数来继承父类的属性，并将父类的实例赋值给子类的原型，实现继承父类的方法。这种方法解决了原型链继承和构造函数继承的问题，但是会导致父类的构造函数被调用两次。

function Parent() {
  this.name = 'Parent';
}

Parent.prototype.sayHello = function() {
  console.log('Hello, I am ' + this.name);
}

function Child() {
  Parent.call(this);
  this.name = 'Child';
}

Child.prototype = new Parent();
Child.prototype.constructor = Child;

var child = new Child();
child.sayHello(); // 输出：Hello, I am Child

优点：

• 子类实例既能访问父类的属性和方法，又有自己的属性和方法。

缺点：

• 父类的构造函数会被调用两次，一次在创建子类原型时，一次在创建子类实例时。

4. 原型式继承

创建一个临时的构造函数，将传入的对象作为该构造函数的原型，然后返回一个新的实例。这种方式类似于对象的克隆，新实例继承了传入的对象的属性和方法。但是，如果修改了新实例的属性，会影响到传入的对象。

function createObject(obj) {
  function F() {}
  F.prototype = obj;
  return new F();
}

var parent = {
  name: 'Parent',
  sayHello: function() {
    console.log('Hello, I am ' + this.name);
  }
};

var child = createObject(parent);
child.name = 'Child';

child.sayHello(); // 输出：Hello, I am Child

优点：

• 简单快捷，可以实现对象的克隆。

缺点：

• 如果修改了新实例的属性，会影响到传入的对象。

5. 寄生式继承

在原型式继承的基础上，添加了一些额外的属性和方法。这种方式类似于构造函数继承，但是没有定义一个真正的构造函数。可以通过在函数内部创建一个新对象，然后将传入的对象作为该对象的原型，最后返回该新对象。

function createObject(obj) {
  var clone = Object.create(obj);
  clone.sayHello = function() {
    console.log('Hello, I am ', + clone.name);
  };
  return clone;
}

var parent = {
  name: 'Parent'
};

var child = createObject(parent);
child.name = 'Child';

child.sayHello(); // 输出：Hello, I am Child

优点：

• 可以在原型式继承的基础上添加额外的属性和方法。

缺点：

• 没有定义一个真正的构造函数。

6. 寄生组合式继承

通过借用构造函数来继承属性，通过原型链的混成形式来继承方法。这种方式是组合继承的一种优化，避免了父类构造函数被调用两次的问题。

function Parent() {
  this.name = 'Parent';
}

Parent.prototype.sayHello = function() {
  console.log('Hello, I am ' + this.name);
}

function Child() {
  Parent.call(this);
  this.name = 'Child';
}

Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;

var child = new Child();
child.sayHello(); // 输出：Hello, I am Child

优点：

• 继承父类的属性和方法，避免了父类构造函数被调用两次的问题。

缺点：

• 略微复杂，需要通过 Object.create() 方法创建新对象，并将父类原型赋值给子类原型。