If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Using object.prototype vs declaring functions in a constructor

I've recently begin delving much more into JavaScript and have realized that what I thought I knew before was not very much. That being said, I've programmed some Java so naturally when I came to JavaScript I wanted to understand how to create objects.

As I dug, I came across two different ways to declare methods and fields for all objects. One of them is to declare them in the constructor:

Another, that I *think* accomplishes the same thing, is to use prototype:

code:

function ExampleObject() {}
//this would have to be defined outside of the constructor, in this case
ExampleObject.prototype.aField = "";
ExampleObject.prototype.method = function(param) {
alert(param);
}

Now, please bear with me as a launch an onslaught of questions, as I've only been nursing my understanding for a couple days now:
1) Do these two code snippets accomplish the same thing? If not, what is the difference and why does it occur? If so, is one way better, faster, or more universally accepted?
2) Does using prototype retain the reference of the this keyword? In other words, if I referred to "this.aField" in the prototype method declaration, would JavaScript know to refer to an ExampleObject's "aField" field?

1) Do these two code snippets accomplish the same thing? If not, what is the difference and why does it occur? If so, is one way better, faster, or more universally accepted?

On the surface, they will both accomplish the same thing. The difference is that when you declare methods in the constructor, then a new copy of each method/function is created for every new instance. Attaching the method to the prototype, on the other hand, creates just one copy of the method/function that is shared across all instances. Using the prototype is better and more universally accepted, though your application would have to grow quite large before you notice any difference.

Originally Posted by snowguy13

2) Does using prototype retain the reference of the this keyword? In other words, if I referred to "this.aField" in the prototype method declaration, would JavaScript know to refer to an ExampleObject's "aField" field?

object.prototype with fields

I've got a follow up question:

I can see how defining methods in a constructor can take extra time, as each function must be created for every instantiation. However, what about fields? Should I define fields using the prototype, or is the constructor okay?

If each instance should have its own copy of some field, which is the case most of the time, then you should declare it in the constructor. Fields set in the prototype will be shared across all instances.

Prototypes are Cool

Finally, I think I'm beginning to understand the prototype. I wish it didn't take explanations from five different sites. xD

Thank you very much.

To check my understanding:

code:

function Object() {}
Object.prototype.field = "hi";

var o1 = new Object();
alert(o1.field); //alerts "hi"
var o2 = new Object();
o2.field = "bye";
alert(o1.field); //this would be "bye", right?
//Or would it still be "hi", since setting a value to o2.field hides the prototypical field
//and creates a field unique to o2?

On the surface, they will both accomplish the same thing. The difference is that when you declare methods in the constructor, then a new copy of each method/function is created for every new instance. Attaching the method to the prototype, on the other hand, creates just one copy of the method/function that is shared across all instances. Using the prototype is better and more universally accepted, though your application would have to grow quite large before you notice any difference.

I tend to disagree. It depends firstly on your object instantiation to object usage ratio. That is, it's a question of where you want to take your performance hit: The prototypal pattern places the hit at method-call time, whereas the "build-it-on-the-fly" approach places the hit at instantiation time.

If performance isn't an issue for your application, the "better" one is simply whichever looks better, is easier to read, and therefore maintain. In my opinion, that's not the prototypal route.