Question

I am trying to learn how to work with ‘classes’ in javascript.

Here is my code:

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

Shape.prototype.toString= function() {
        return 'Shape at '+this.x+', '+this.y;
    };

function Circle(x, y, r) {
    Shape.call(this, x, y); // invoke the base class's constructor function to take co-ords
    this.r= r;
}
Circle.prototype= $.extend(true, {}, Shape.prototype);

Circle.prototype.toString= function() {
    return 'Circular '+Shape.prototype.toString.call(this)+' with radius '+this.r;
}

var c = new Circle(1,2,3);
alert(c);

Is there a way to define the Shape’s toString function inside it’s constructor, or it does not make sense in this situation?

Answer 1

Base on my understanding:

1. When you move .toString() into the constructor then .toString() becomes an explicit member of your instance. hence any call to .toString() will fire that explicit member.

Example: http://jsfiddle.net/paptamas/qDSkj/

1. But when you define that as a prototype, (in the absence of an explicit member called .toString()), any call to .toString() method will fire .toString() function that is defined for the type of calling object (Circle in your case).

Example: http://jsfiddle.net/paptamas/cbnLB/

In other words, explicit members have priority over prototype definitions and when you say

this.toString = function() ...

you are defining that function as a member of your instance (as oppose to member of your type – which is in a way not optimized as well).

Regards.