Meaning of prototype in javascript

Question

I wrote short code of inheritance of reader from Person:

Answer 1

The difference is that when you put it on the prototype, all instances of Person share the same code for getName -- you can change getName on all instances of Person by assigning something else:

Person.prototype.getName = function() { return 'Mr Jones' };

Also, since they share the same code, it's less memory intensive: You only have one copy of the getName function, instead of one copy per instance.

Another difference is that you can later set the Person as the prototype of another class, let's say Man, and it will inherit the properties/methods.

Update: Here is a good post explaining other properties of prototypes: https://stackoverflow.com/a/1534286/295262

Answer 2

When you put something on the prototype, every instance of the object shares the same code for the method. They are all using the same function instance.

When you simply put a method on this, every object instance has its own copy of the same method.

Using prototype is much more efficient. Note this is why typically methods are placed on the prototype, since you typically want all instances to use the same method, but properties are placed on the instance itself, because typically you don't want all instances to share the same properties.

For your comment, if you put a method on the constructor function of an object, then you have in effect created a "static" method. No instance of the object will have that method, they all must access it on the constructor function. So in your case, Person.someMethod().

Answer 3

In class-based words the difference between declaring a function via prototype and this would be something like this:

prototype:

the function of the instance would look like this:

somefunc = function(){super()/*call the function of the super-class*/};

this:

the function of the instance would look like this:

somefunc = function(){/* Do same stuff as in the prototype func declared */};

Now changing the function on the prototype will have no effect on the instance.

Answer 4

When you put the method in the constructor and create an object out of that constructor, each object carries it's own getName function. For 10 Person instances, each carries it's own getName, therefore 10 separate getName functions.

If you place getName in the prototype of the constructor, that same getName function is shared/inherited across all instances. so for 10 instances of Person, each has getName but refer only to 1 getName function.

Using prototypes saves memory since the method is shared across instances so only one is used.

Answer 5

When you add any function with this.functionname to any object constructor every object created by that constructor makes their own copy of that function which also takes memory. Imagine if you have several objects created by same constructor and how much memory it will take. on other hand when you creates it with cunstructorName.prototype.functionName function loads only once in memory and every object shares same prototype function constructor. this approach makes your code faster in loading and operation and also saves a big chunk of memory.

Answer 6

The difference is that is you further extend the Person class the sub classes will not inherit the getName() method

Edit: I was not correct in above statement. Just tested on the jsfiddle. Regardless of if we define a method on the prototype or on the function instance itself, it is available for the subclasses in the chain.

Here is the proof: http://jsfiddle.net/u8qrd/

I understand that there is a performance/memory benefit of attaching the methods to prototype. Appart from that isn't there any behavioral difference when it comes to inheritance?

(hopefully I'm not violating SO rules by asking a question here)