JS 原型链：理解继承关系与 proto

2023-09-03 23:58:52

在 JavaScript 中，原型链是一个非常重要的概念，它决定了对象的继承关系和属性查找机制。在这个话题的文档中，我们将深入浅出地探讨原型链，并对其中的关键概念进行详细讲解，包括继承、proto 和 prototype。了解这些内容，有助于我们更好地理解 JavaScript 对象的创建和使用，从而编写出更加健壮可靠的代码。

原型链概述

原型链是一个从对象到其原型对象的链式结构，它定义了对象的继承关系和属性查找顺序。JavaScript 中的所有对象都具有一个原型对象，这个原型对象也是一个对象，它包含了该对象所继承的属性和方法。当我们访问一个对象的属性或方法时，JavaScript 会首先在该对象中查找，如果没有找到，则会沿着原型链向上查找，直到找到该属性或方法为止。

继承关系

在 JavaScript 中，继承是一种创建新对象并从现有对象中继承属性和方法的方式。新创建的对象被称为子对象或派生对象，而现有对象被称为父对象或基类。子对象可以访问父对象的属性和方法，并可以对其进行修改。需要注意的是，子对象并不会直接修改父对象，而是创建了一个自己的属性或方法副本。

proto

proto 是 JavaScript 中的一个内置属性，它指向对象的原型对象。通过使用 proto，我们可以访问和修改对象的原型对象。例如，我们可以使用以下代码来访问对象的原型对象：

let obj = {};
console.log(obj.__proto__);

这段代码将输出一个对象，该对象是 obj 的原型对象。我们可以使用以下代码来修改对象的原型对象：

let obj = {};
obj.__proto__ = {
  name: 'John Doe',
  age: 30
};

这段代码将修改 obj 的原型对象，使其包含 name 和 age 属性。

prototype

prototype 是 JavaScript 中的另一个内置属性，它指向对象的构造函数的原型对象。通过使用 prototype，我们可以访问和修改构造函数的原型对象。例如，我们可以使用以下代码来访问构造函数的原型对象：

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

console.log(Person.prototype);

这段代码将输出一个对象，该对象是 Person 构造函数的原型对象。我们可以使用以下代码来修改构造函数的原型对象：

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

Person.prototype.greet = function() {
  console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
};