ECMAScript 2021：原型链继承的通俗解读

ECMAScript 2021 的规范文稿中，对原型对象和对象的关系进行了重新解读，值得深入研究。它以一种通俗易懂的方式解释了构造函数、共享方法和原型对象三者之间的关系。让我们用一幅图来帮助理解：

构造函数 -> 共享方法 -> 原型对象

构造函数

构造函数用于创建对象实例。当使用 new 调用构造函数时，就会创建一个新对象。这个新对象被称为构造函数的实例。构造函数中的代码将在创建实例时执行。

共享方法

共享方法是构造函数的属性，它可以被构造函数的所有实例共享。共享方法通常是函数，但也可以是其他类型的值。

原型对象

原型对象是一个特殊的对象，它是所有构造函数实例的父对象。原型对象包含构造函数的所有共享方法。当构造函数实例访问一个不存在的属性或方法时，JavaScript 就会在原型对象中查找该属性或方法。

原型链继承

原型链继承是 JavaScript 中实现继承的一种方式。子构造函数可以继承父构造函数的属性和方法。子构造函数的原型对象指向父构造函数的实例。这意味着子构造函数的实例可以访问父构造函数的所有共享方法。

举个例子

为了更好地理解原型链继承，让我们举一个例子。假设我们有一个 Person 构造函数，它定义了一个 name 属性和一个 greet() 方法。

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

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

现在，让我们创建一个 Student 构造函数，它继承自 Person 构造函数。

function Student(name, major) {
  Person.call(this, name);
  this.major = major;
}

Student.prototype = Object.create(Person.prototype);

Student 构造函数继承了 Person 构造函数的 name 属性和 greet() 方法。它还定义了一个新的属性 major。

现在，让我们创建一个 student 对象。

const student = new Student('John', 'Computer Science');

我们可以通过 student 对象访问 name 属性和 greet() 方法。

console.log(student.name); // John
student.greet(); // Hello, my name is John

我们还可以通过 student 对象访问 major 属性。

console.log(student.major); // Computer Science

总结

原型链继承是 JavaScript 中实现继承的一种方式。子构造函数可以继承父构造函数的属性和方法。子构造函数的原型对象指向父构造函数的实例。这意味着子构造函数的实例可以访问父构造函数的所有共享方法。