Javascript使用constructor.prototype访问超类成员失败？

Question

我有一个小代码sn-p：

function father(){
    this.id=10
}
function child(){}
console.log(child.prototype.constructor);//[Function: child]
child.prototype=new father();
//child.prototype.constructor = child; // key line
var son=new child();
console.log(child.prototype.constructor);//[Function: father]
console.log(son.constructor.prototype.id);//undefined.

正如代码所示，我使用原型链来创建“儿子”对象。 但是最后一行打印出来

"undefined". 

这对我来说很奇怪。 child.prototype.constructor是[Function:father]，而“id”其实是“father”的一个属性，为什么打印undefined？

如果我取消注释

    child.prototype.constructor = child; // key line

然后它按我的预期打印“10”。对我来说，是否有关键线的区别在于 child.prototype.constructor 是“孩子”还是“父亲”。但是 'id' 是父属性，为什么需要在我的代码中设置关键行？

谢谢。

Answer 1

步骤 1)

function father(){
    this.id=10
}
function child(){}

看起来像

这种情况下console.log(child.prototype.constructor);//[Function: child] 会按您的预期工作

第 2 步）child.prototype=new father();

现在您在这里看到，原来的child.prototype 丢失了，child.prototype.constructor 也丢失了。您从 father 创建了一个对象并将该对象用作 child.prototype

第 3 步）var son=new child();

现在console.log(child.prototype.constructor);//[Function: father] 很容易理解。

我们如何到达那里？ son.__proto__.__proto__.constructor.

现在，考虑相同的图像

console.log(son.constructor.prototype.id);//undefined.这里发生了什么？ son.constructor 只不过是 father 和 son.constructor.prototype 只不过是 father.prototype ，它没有属性名称 id。

注意： son.constructor 是 son.__proto__.__proto__.constructor

现在你取消注释 child.prototype.constructor = child; 会发生什么？

您正在向child.prototype 添加一个constructor 属性，在这种情况下，当您说son.constructor 这意味着child 和son.constructor.prototype 只不过是child.prototype，它确实有一个属性名称id值为 10。

抱歉所有图片和不好的解释！！

Answer 2

实际上，您正在覆盖子 function() 的原型对象，因此内部 proto 链接丢失了。

function father(){
    this.id=10
}
function child(){}
console.log(child.prototype.constructor);//[Function: child]
child.prototype=new father();
child.__proto__ = father;
var son=new child();
console.log(child.prototype.constructor);//[Function: father]
console.log(son.id);//10