关于 JavaScript 继承的谜题

Question

我知道 JavaScript 中继承的概念是通过原型链，但我不确定我是否理解正确。当一个属性被读取时，引擎会先搜索实例自身的属性，如果没有找到会搜索实例的[[Prototype]]属性，该属性是对创建实例的函数原型的引用，搜索将继续，直到到达 Object.prototype。对于以下代码：

var person1 = {
    name: "Qiushi",
    sayName: function() {
        console.log(this.name);
    }
};

person1.sayName();  // Qiushi

var person2 = Object.create(person1);
person2.name = "Alex";
console.log(person2.hasOwnProperty("sayName")); // false
person2.sayName();  // Alex

当person2继承自person1时，person2可以使用person1中定义的方法。但是 sayName 方法不是 person1 原型的属性，而是它自己的属性。我的问题是，由于方法搜索仅遵循原型链，person2 将如何使用不在此链中的方法？

-------------------最终编辑------------- ------------

如果你对这个问题有同样的担忧，请阅读我和金博的对话。

Answer 1

作为其他对象原型的对象没有什么特别之处，它们只是对象。

当引擎去读取一个属性时，首先它会查看对象本身是否有它，如果有，就使用它。如果没有，它会查看对象的原型，然后查看 其 原型等。

在您的代码中，person1 是person2 的原型，因此在person2 上查找sayName 时，由于引擎在person2 上找不到它，它会在person2 上查找它s 原型，person1，并找到它。

这是您在代码中设置的简单 ASCII 艺术图：

+-------------------+ 人1-----------+-->| （对象） | | +-------------------+ | | __proto__ |-->（未显示，Object.prototype） | |名称：《秋实》 | | | sayName: 函数 | | +-------------------+ | +--------------+ | 人2---->| （对象） | | +--------------+ | | __proto__ |--+ |名称：“亚历克斯” | +---------------+

这是一个更完整的版本：

+------------+ 对象--->| (函数) | +->（未显示，Function.prototype） +------------+ | | __proto__ |--+ +--------------------+ |原型 |---------------------------------+-->| （对象） | +------------+ | +--------------------+ +-------------------+ | | __proto__: null | 人1-----------+-->| （对象） | | | toString: 函数 | | +-------------------+ | | valueOf: 函数 | | | __proto__ |--+ | ... | | |名称：《秋实》 | +--------------------+ | | sayName: 函数 | | +-------------------+ | +--------------+ | 人2---->| （对象） | | +--------------+ | | __proto__ |--+ |名称：“亚历克斯” | +---------------+

Answer 2

Object.create 返回一个新对象，其中提供的参数是新对象的原型对象。

所以你现在得到了这个：

{人2} - 名称：'亚历克斯' - {原型} - 名称：'Quishi' -sayName：函数

因此，如果您在 person2 上查找属性 name，它将在 person2 本身上找到该属性，而不是在原型上查找。如果你查找sayName，它不会在 person2 上找到它，所以它会在原型上查找并在那里找到它。

this 关键字将在函数中引用取决于函数从何处调用。这就是this 的工作原理。当您在对象上调用方法时，该对象将是该方法内的this。因此，即使该方法在原型上，如果您调用 person2.sayName();，this 仍将引用 person2。如果您要更改它（例如通过.call），您可以更改输出。

控制台.log(person2.name); // -> 亚历克斯 person2.sayName(); // -> 亚历克斯 person2.sayName.call(person2.__proto__); // -> Quishi，即使调用了 person2 person1.sayName(); // -> 奎师 person1.sayName.call(person2); // -> Alex，即使调用 person1

我指出这一点是因为在此示例中误解 this 的可能性与误解原型的可能性一样多。