JavaScript中的继承揭秘：从原型链到 ES6 增强特性

2023-11-08 22:43:31

## 从原型链到继承：JavaScript 揭秘

引言

面向对象编程 (OOP) 的核心原则之一是继承，它允许对象继承自父类或超类的属性和方法。在面向类的语言中，继承通过类来实现，但 JavaScript 采用了一种不同的方法，即原型链。本文将深入探讨 JavaScript 中的继承机制，从其传统方式到 ES6 引入的现代增强特性。

原型链：JavaScript 的传统继承

在 JavaScript 中，对象不是从类实例化的，而是从其他对象创建的。每个对象都有一个内部属性，称为 [[Prototype]]，它指向其父对象。这个父对象也有一个指向其父对象的 [[Prototype]] 属性，如此一直向上追溯，形成一个对象链，称为原型链。

当一个对象尝试访问一个不存在的属性或方法时，JavaScript 会沿着原型链向上查找，直到找到该属性或方法为止。如果原型链的末端都没有找到，则会返回 undefined。

通过原型链实现继承

传统上，JavaScript 中的继承是通过修改对象的原型链来实现的。具体来说，子对象的 [[Prototype]] 属性被设置为父对象的 [[Prototype]]，这使得子对象可以访问父对象的所有属性和方法。

// 父对象
const Person = {
  name: 'John Doe',
  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

// 子对象
const Employee = {
  __proto__: Person,
  salary: 1000,
  work() {
    console.log('I am working');
  }
};

在上面的示例中，Employee 对象继承自 Person 对象，因为其 [[Prototype]] 属性指向 Person。因此，Employee 对象不仅可以访问自己的 salary 和 work 属性和方法，还可以访问父对象 Person 的 name 和 greet 属性和方法。

ES6 继承：类和超类

ES6 引入了类和超类的概念，为 JavaScript 中的继承提供了更现代、更面向类的语法。类充当蓝图，用于创建对象实例，而超类充当父类。

// 超类
class Person {
  constructor(name) {
    this.name = name;
  }

  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
}

// 子类
class Employee extends Person {
  constructor(name, salary) {
    super(name);
    this.salary = salary;
  }

  work() {
    console.log('I am working');
  }
}