JS 继承方式|极客笔记

JS 继承方式

在面向对象编程中，继承是非常重要的概念。它允许我们创建一个新的类，该类可以继承另一个类的属性和方法。在JavaScript中，我们有几种方式来实现继承，包括原型链继承、构造函数继承、组合继承、原型式继承、寄生式继承和ES6中的class继承。本文将详细介绍这些继承方式，并且给出相应的示例代码。

1. 原型链继承

原型链继承是JavaScript中最常见的一种继承方式。通过将子类的原型指向父类的一个实例来实现继承。这意味着子类继承了父类的所有属性和方法。

示例代码：

function Animal(name) {
  this.name = name;
}

Animal.prototype.sayName = function() {
  console.log("My name is " + this.name);
}

function Dog(name, breed) {
  this.breed = breed;
}

Dog.prototype = new Animal();

let myDog = new Dog("Max", "Labrador");
myDog.sayName(); // 输出 "My name is Max"

运行结果：

My name is Max

2. 构造函数继承

构造函数继承是通过在子类构造函数中调用父类构造函数来实现继承。这样子类就可以继承父类的属性。

示例代码：

function Animal(name) {
  this.name = name;
}

function Dog(name, breed) {
  Animal.call(this, name);
  this.breed = breed;
}

let myDog = new Dog("Max", "Labrador");
console.log(myDog.name); // 输出 "Max"

运行结果：

Max

3. 组合继承

组合继承是将原型链继承和构造函数继承结合在一起的一种继承方式。通过在子类构造函数中调用父类构造函数，同时将子类的原型指向父类的一个实例来实现继承。

示例代码：

function Animal(name) {
  this.name = name;
}

Animal.prototype.sayName = function() {
  console.log("My name is " + this.name);
}

function Dog(name, breed) {
  Animal.call(this, name);
  this.breed = breed;
}

Dog.prototype = new Animal();

let myDog = new Dog("Max", "Labrador");
myDog.sayName(); // 输出 "My name is Max"

运行结果：

My name is Max

4. 原型式继承

原型式继承是一种简单的继承方式，它利用一个空对象作为中介，将一个对象作为另一个对象的原型。

示例代码：

let animal = {
  name: "Animal",
  sayName: function() {
    console.log("My name is " + this.name);
  }
};

let dog = Object.create(animal);
dog.name = "Max";
dog.sayName(); // 输出 "My name is Max"

运行结果：

My name is Max

5. 寄生式继承

寄生式继承是在原型式继承的基础上进行了一定的封装，返回一个增强的对象。这种方式可以在不需要创建构造函数的情况下实现对对象的继承。

示例代码：

function createDog(name) {
  let dog = Object.create(animal);
  dog.name = name;
  return dog;
}

let myDog = createDog("Max");
myDog.sayName(); // 输出 "My name is Max"

运行结果：

My name is Max

6. ES6中的class继承

ES6引入了class关键字，使得在JavaScript中实现类和继承更加简洁和直观。通过使用extends关键字可以实现类的继承。

示例代码：

class Animal {
  constructor(name) {
    this.name = name;
  }

  sayName() {
    console.log("My name is " + this.name);
  }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name);
    this.breed = breed;
  }
}

let myDog = new Dog("Max", "Labrador");
myDog.sayName(); // 输出 "My name is Max"