Question

我有这个典型的继承链：

＆＃13;

function Class1() {};
Class1.prototype.name = 'Main Class';

function Class2() {};
Class2.prototype = Object.create(Class1.prototype);
Class2.prototype.constructor = Class2;

function Class3() {};
Class3.prototype = Object.create(Class1.prototype);
// Note missing reassignment of constructor for Class3

var class2Ins = new Class2();
var class3Ins = new Class3();

console.log(Object.getPrototypeOf(class2Ins)); // Class2 { ... }
console.log(Object.getPrototypeOf(class3Ins)); // Object { ... }

＆＃13;

我有一个混乱，Object.getPrototypeOf(class3Ins)是一个对象，即使它的原型是Class3。

Answer 1

我认为你对JS原型委派的工作原理有点不清楚。

首先，当我在浏览器中运行您的代码时，我得到以下输出：

Object { constructor: Class2() } 
Object {  }

您可能想要检查输出是否相同或是否不同。

现在，概念。

创建函数时，JS引擎会创建一个匿名对象并按如下方式绑定2：
function foo(){} // user created a function

/* The JS engine binds an anonymous object */
// foo.prototype = {};
// foo.prototype.constructor = foo;

另外，

使用new由构造函数创建对象时，
  创建的对象的[[Prototype]]（或.__proto__）为
  设置为function.prototype
引用（指向）的匿名对象

并且

Object.create()方法使用指定的原型对象和属性创建一个新对象。

好的，那么这一切意味着什么？

让我们将您的代码分解成块，就好像我们是引擎一样。

function Class1() {};
/*
  bind anonymous object:

  Class1.prototype = {};
  Class1.prototype.constructor = Class1;
*/
Class1.prototype.name = 'Main Class';


function Class2() {};
/*
  bind anonymous object:

  Class2.prototype = {};
  Class2.prototype.constructor = Class2;
*/
Class2.prototype = Object.create(Class1.prototype);
/*
  create new object with prototype as the specified object:

  Class2.prototype = {};
  Object.setPrototypeOf(Class2.prototype, Class1.prototype);
*/
Class2.prototype.constructor = Class2;


function Class3() {};
/*
  bind anonymous object:

  Class3.prototype = {};
  Class3.prototype.constructor = Class3;
*/
Class3.prototype = Object.create(Class1.prototype);
/*
  create new object with prototype as the specified object:

  Class3.prototype = {};
  Object.setPrototypeOf(Class3.prototype, Class1.prototype);
*/
// Note missing reassignment of constructor for Class3


var class2Ins = new Class2();
/*
  set [[Prototype]] of the created object to object referenced by the function.prototype:

  Object.setPrototypeOf(class2Ins, class2.prototype);
*/
var class3Ins = new Class3();
/*
  set [[Prototype]] of the created object to object referenced by the function.prototype:

  Object.setPrototypeOf(class3Ins, class3.prototype);
*/

最终结果是什么？

Object.getPrototypeOf(class3Ins)（简单来说，class2Ins.__proto__）与Class2.prototype
Class2.prototype是由Object.create(Class1.prototype)创建的对象。
Class2.prototype.__proto__与Class1.prototype相同。

class3Ins.__proto__与Class3.prototype
Class3.prototype是由Object.create(Class1.prototype)创建的对象。
Class3.prototype.__proto__与Class1.prototype相同。

Object.getPrototypeOf(class3Ins)为空的原因是Object.create创建了一个空对象。

如果您仍然感到困惑，请访问：http://www.javascripttutorial.net/javascript-prototype/

理解JS中的原型概念是一个很好的资源。

Object.getPrototypeOf（classInstance）返回Object {}

1 个答案:

最终结果是什么？