0

All, After reading this post, and did some test based on it .

        function Shape() {
            this.x = 0;
            this.y = 0;
        };

        Shape.prototype.move = function(x, y) {
            this.x += x;
            this.y += y;
            console.log("Shape moved.");
        };

        // Rectangle - subclass
        function Rectangle() {
            //Shape.call(this); //call super constructor.
        };

        Rectangle.prototype = Object.create(Shape.prototype);

        var rect = new Rectangle();
                    alert(rect.x);

If I commented the code Shape.call(this); in the Rectangle, I found the rect.x is underfined instead of the value 0.

And What make me confused is that I found in the best answer of the Post said:

"In javascript, every object has a secret link to the object which created it,forming a chain. When an object is asked for a property that it does not have,its parent object is asked... continually up the chain until the property is found or until the root object is reached."

So I can't understand why the rect can't found x in the prototype chain. The rect is already inherited form Shape. If the x doesn't exist in the rect, It supposed be found in his parent. right ? And in my understanding .If using Shape.call(this); , It just add a new x property to the rect, well ,that would not be a code reusing the original x from parents. It just like the override property in the classical inheritance . that is add a new property into the sub class which have the same name and type as the one in the base class..I don't know if my understanding is right , if not . please correct me .Or was I missing something I didn't noticed ? thanks.

Edit

Below is my understanding based on the Thilo and Arun P Johny 's answers. please correct me if it is not right.

Before inheritance happen.

enter image description here

After inheritance executed.

enter image description here

So the x only belong to the instance constructed by Shape. thanks

4

2 回答 2

1

如果您不调用超级构造函数，则this.x = 0不会执行，因此x保持未定义。

如果你想让它出现在原型中，你不得不说Shape.prototype.x = 0，我想。

所以我不明白为什么在原型链中rect找不到。x

这是因为原型也没有x。它只有move. 被分配给构造函数中的x各个实例（但仅当您调用它时）。

于 2013-04-21T08:43:16.433 回答
1

Arun P Johny 是对的（你应该阅读他的评论！）

尝试这个：

    function Shape() {
        this.x = 0;
        this.y = 0;
    };

    Shape.prototype.move = function(x, y) {
        this.x += x;
        this.y += y;
        console.log("Shape moved.");
    };


    // Rectangle - subclass
    function Rectangle() {            
    };

    Rectangle.prototype = new Shape();
    var rect = new Rectangle();
    alert(rect.x);

您可以Shape.call(this);像在代码中那样调用（注释），但这种方式不是“真正的”继承，因为您将无法move()在 Rectangle 中使用。

但是上面的代码是“新”和原型的混杂，因此非常混乱。我想你真正想做的是这样的：

   var Shape = {
        x: 0,
        y: 0,
        move: function(x, y) {
            this.x += x;
            this.y += y;
            alert("Shape moved: ["+this.x+","+this.y+"]");
        }
    };

    var rect = Object.create(Shape);
    alert(rect.x);
    rect.move(2,3);
    rect.move(1,1);
于 2013-04-21T09:00:17.823 回答