JavaScript 继承的艺术：从概念到实战

javascript 继承的概念

JavaScript 继承是一种允许对象从其他对象继承特性和方法的技术。通过继承，您可以创建对象层次结构，每个对象继承其父对象的属性和行为。JavaScript 继承有两种主要机制：基于原型的继承和基于类的继承。

基于原型的继承

这是 JavaScript 中的传统继承方法。每个对象都有一个内部属性称为原型，它指向其父对象。当对象访问一个不存在于自身中的属性或方法时，就会沿着原型链向上查找，直到找到该属性或方法或到达原型链的末尾。

基于类的继承

es6 引入了基于类的继承，类似于面向对象编程语言中的继承。您使用 class 关键字定义一个类，并使用 extends 关键字从该类继承一个子类。子类继承父类的属性和方法，并且可以覆盖或扩展它们。

实战中的继承

创建原型链

// 父对象
const Person = {
  name: "John Doe",
  age: 25,
};

// 子对象
const Student = {
  __proto__: Person, // 继承 Person 的原型
  major: "Computer Science",
};

console.log(Student.name); // "John Doe"

使用 ES6 类进行继承

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}

class Student extends Person {
  constructor(name, age, major) {
    super(name, age); // 调用父类的构造函数
    this.major = major;
  }
}

const student = new Student("Jane Doe", 22, "Computer Science");
console.log(student.name); // "Jane Doe"

覆盖和扩展方法

子类可以覆盖或扩展父类的方法。

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

class Student extends Person {
  greet() {
    super.greet(); // 调用父类的方法
    console.log(`I am a student majoring in Computer Science.`);
  }
}

继承链和原型污染

原型链可以形成一个继承链，但它也有一个缺陷：它容易受到原型污染。任何代码都可以修改对象的原型，从而影响所有继承它的对象。例如：

// 修改 Person 的原型
Person.prototype.evil = true;

// 现在所有继承 Person 的对象都具有 evil 属性
console.log(Student.evil); // true

为了防止原型污染，可以冻结对象的原型：

Object.freeze(Person.prototype);
Person.prototype.evil = true; // TypeError: Cannot add property evil to a frozen object

结论

JavaScript 继承是一种强大的工具，可以组织和重用代码。了解基于原型的和基于类的继承的概念对于创建灵活和可维护的应用程序至关重要。通过精心规划您的继承链并防止原型污染，您可以有效地使用继承来构建可靠且可扩展的软件。