Mozilla 文档中给出的原型概念

Question

我正在阅读 Mozilla 文档 (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Details_of_the_Object_Model) 中给出的 JavaScript 对象模型，并且有一个可能非常愚蠢的问题。

如您所见，它描述了一个基于原型的继承层次结构（Manager 继承自 Employee），如下所示：

function Employee() {
  this.name = "";
  this.dept = "general";
}

function Manager() {
  Employee.call(this);
  this.reports = [];
}

Manager.prototype = Object.create(Employee.prototype);

最后一行不应该说Employee而不是Employee.prototype吗？如果我们要构建原型链，我认为应该是前者。请解释一下。

Answer 1

这是因为Object.create 需要一个原型作为第一个参数。您可以在以下link 找到所有规格。

我还继续测试了您建议的案例，它显示了一个有趣的行为。

案例#1

function Employee() {
  this.name = "";
  this.dept = "general";
}

function Manager() {
  Employee.call(this);
  this.reports = [];
}

Manager.prototype = Object.create(Employee.prototype);

如果我们创建一个新的 Manager()，我们会得到以下结果：

var x = new Manager();
console.log(x);

控制台输出：经理{name：“”，部门：“general”，报告：Array[0]}

如果我们根据您的建议更改代码并将 Employee 作为参数而不是 Employee.prototype 传递：

案例#2

function Employee() {
  this.name = "";
  this.dept = "general";
}

function Manager() {
  Employee.call(this);
  this.reports = [];
}

Manager.prototype = Object.create(Employee);

如果我们现在继续创建一个 Manager，新创建的对象将不会像 案例 #1 中那样包含 name 属性：

var y = new Manager();
console.log(y);

控制台输出：经理{部门：“一般”，报告：数组[0]}

编辑#1

我做了更多研究，并在 Stackoverflow (link) 上发现了另一个问题，可以解释这种行为。

它似乎与构造函数的行为方式有关。

正如上述线程中所述，当您使用 new 运算符创建对象时，您基本上创建了一个继承自该对象原型的新对象。

因此，由于 JavaScript 继承是对象到对象的，因此将原型作为您希望新对象继承的蓝图传递是有意义的。