更改构造函数原型的问题 [英] Problems with changing constructor's prototype

问题描述

我目前正在阅读Stoyan Stefanov的书面向对象的JavaScript，我偶然发现了一个有趣的问题。这是代码：

I'm currently going through Stoyan Stefanov's book "Object-oriented JavaScript" and I've stumbled on an interesting problem. Here's the code:

var shape = {
    type: 'shape',
    getType: function() {
        return this.type;
    }
};

function Triangle(a, b, c) {
    this.a = a;
    this.b = b;
    this.c = c;
    this.type = 'triangle';
}

Triangle.prototype = shape; // changing the prototype object
Triangle.prototype.getPerimeter = function() {
    return this.a + this.b + this.c;
}

var t = new Triangle(1, 2, 3);
t.constructor; // logs Object() instead of Triangle(a, b, c)

如您所见，这是一个构造函数的简单示例，该构造函数从原型对象中获取了一些属性。但是对象t的构造函数属性指向Object（）对象而不是Triangle（a，b，c），因为它应该具有。如果我用原型更改评论该行，一切正常。我的问题是什么？
（重读面向对象的Javascript和JavaScript模式中的整个原型章节，找不到答案）。
P.S.抱歉我的英语不好，试着去练习。 ：）

As you can see, here is a simple example of the constructor inhereting some properties from the prototype object. But the constructor property of object t points to the Object() object instead of Triangle(a, b, c), as it should have. If I comment the line with the prototype change, though, everything works fine. What's my problem? (Reread the whole prototype chapter in Object-oriented Javascript and JavaScript Patterns, couldn't find an answer). P.S. Sorry for my bad English, trying to practice it. :)

推荐答案

我将分两部分解释你的代码。首先，实际上构造函数属性是什么？其次，为什么不在代码中返回 Objects ？

I will explain your code in two parts. Firstly, what is the constructor property actually? Secondly, why doesn't it return Objects in your code?

在Stoyan Stefanov的书中，p150，他说：

In Stoyan Stefanov's book, p150, he states:

prototype是一个定义函数后立即创建的属性。 其初始值为空对象。

错误。根据 JavaScript权威指南第9.2节

prototype属性的初始值是具有单个属性的对象。 此属性命名为构造函数，并引用与原型关联的构造函数。

The initial value of the prototype property is an object with a single property. This property is named constructor and refers back to the constructor function with which the prototype is associated.

您可以使用 Triangle.prototype.constructor 进行测试。它已在定义函数时设置。

You can test it with Triangle.prototype.constructor. It has been set when the function is defined.

结论1 ：构造函数实际上是 Constructor.prototype 的属性。在您的情况下，它是 Triangle.prototype.constructor 。

Conclusion 1: the constructor is in fact the property of Constructor.prototype. In your case, it is Triangle.prototype.constructor.

Triangle 的所有实例都可以通过原型链访问此属性。 但是这些对象本身没有构造函数属性。以下代码证明了这一点：

All the instances of Triangle could access this property through the prototype chain. But these objects themselves don't have the constructor property. The following code proves it:

function Triangle(a, b, c) {
    this.a = a;
    this.b = b;
    this.c = c;
    this.type = 'triangle';
}
var t = new Triangle(1, 2, 3);
t.hasOwnProperty('constructor');
>>false
t.__proto__.hasOwnProperty('constructor');
>>true

结论2 ：当你访问实例的构造函数属性，从原型链中获取它们。

Conclusion 2: when you access the constructor property of an instance, you get them from the prototype chain.

你将 Triangle.prototype 设置为 shape 不包含原始构造函数属性。

You set Triangle.prototype to shape which doesn't contain the originalconstructor property.

因此，这一次，当您查询 t.constructor 时，它将在以下过程中解决它：

Thus, this time, when you query t.constructor, it will resolve it in the following process:

1. 查看它自己的属性并找不到构造函数


2. 继续查找 t .__ proto __ ，这是 Triangle.prototype 。您已将其设置为 shape ，其中不包含构造函数属性。


3. 继续沿着原型链查找 - t .__ proto __.__ proto __ 。它是 Triangle.prototype .__ proto __ ，它被解析为 Object.prototype 。 Object.prototype 具有构造函数属性，它引用 Object 。

1. Look at it's own properties and find no constructor
2. Keep looking up to t.__proto__, which is Triangle.prototype. You have set it to shape which doesn't contain the constructor property.
3. Continue looking up along the prototype chain - t.__proto__.__proto__. It is Triangle.prototype.__proto__, and it is resolved as Object.prototype. Object.prototype has the constructor property and it refers to Object.

这篇关于更改构造函数原型的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！