了解 JavaScript 中的原型链

JavaScript 中的每一个对象都有一个原型对象，这个原型对象又有自己的原型对象，这样就形成了一个链式的结构，被称为“原型链”。

在 JavaScript 中，使用构造函数（Constructor）创建对象时，每个对象都有一个隐式的属性，即它的原型对象（Prototype）。当对象需要获取属性或方法时，它会先从自身属性中查找，如果没有找到，则会从它的原型对象中查找，然后继续查找原型对象的原型对象，直到查找到最顶层的原型对象为止。如果最终还是没有找到，那么这个对象就没有这个属性或方法。

构造函数

构造函数（Constructor）是 JavaScript 中创建对象的主要方式之一。构造函数本身就是一个普通的函数，它没有任何特殊的地方，但是当它通过 new 关键字调用时，它就可以创建一个与函数同名的对象，并把这个对象的原型指向构造函数的原型。

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

const person = new Person('John', 25);

console.log(person.name); // John
console.log(person.age); // 25

在上面的例子中，我们创建了一个名为 Person 的构造函数，并使用 new 关键字调用它来创建一个名为 person 的对象。这个对象的 name 属性被设置为 'John'，age 属性被设置为 25。

原型对象

在 JavaScript 中，每个对象都有一个隐式的属性，即它的原型对象。如果我们需要访问一个对象自身没有的属性或方法，JavaScript 引擎会沿着这个对象的原型链向上查找，直到找到这个属性或方法或者到达原型链的顶部。

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

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

const person = new Person('John', 25);

person.sayHello(); // Hello, my name is John

在上面的例子中，我们创建了一个名为 Person 的构造函数，并向它的原型对象添加了一个 sayHello 方法。在创建 person 对象时，这个对象就继承了原型对象中的 sayHello 方法，可以通过 person.sayHello() 调用该方法。

原型链

原型链是指每个对象的原型对象又有自己的原型对象，这样就形成了一个链式的结构。通过这个结构，JavaScript 引擎实现了属性和方法的继承。

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

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

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

Student.prototype.sayGrade = function() {
  console.log(`I am in grade ${this.grade}`);
};

const student = new Student('John', 18, 12);

console.log(student.name); // John
console.log(student.age); // 18
student.sayHello(); // Hello, my name is John
student.sayGrade(); // I am in grade 12

在上面的例子中，我们创建了一个名为 Person 的构造函数和一个名为 Student 的构造函数。由于 Student 对象需要继承 Person 对象的属性和方法，我们需要向 Student.prototype 中添加 Person.prototype 对象的副本。这样，当 Student 对象需要访问属性和方法时，JavaScript 引擎会沿着原型链向上查找，找到 Person.prototype 中的属性和方法，并在 Student.prototype 中添加 Student 对象的属性和方法。

总结

原型链是 JavaScript 中实现继承的主要方式之一。通过原型链，一个对象可以从它的原型对象中继承属性和方法，并沿着原型链向上查找。理解 JavaScript 中的原型链对于如何编写高质量的 JavaScript 代码至关重要。