Advantage of using prototype objects over regular functions?

[Yansky]

I'm just starting to learn about the prototype object in javascript
and I was wondering if someone could explain just in laymans terms why
you would use it instead of a regular functions? It seems like it does
the same thing as regular functions except in a more complicated way.

 

[Joost Diepenmaat]

I'm just starting to learn about the prototype object in javascript
and I was wondering if someone could explain just in laymans terms why
you would use it instead of a regular functions? It seems like it does
the same thing as regular functions except in a more complicated way.

Are you asking about the advantages and disadvantages of object-oriented
constructs w/ method calls vs function calls, or about the use of
prototypes vs putting all properties including methods in the same
object?

Objects provide their own mechanism for property lookup. This means that
different objects can provide methods and properties with the same name
to do different things. In other words, they provide a straight forward
way of doing polymorphism:

myCollectionOfObjects.forEach(function(o) {
o.quack(); // what quack() does is determined by o itself
});

Functions are useful for actions that aren't intimately tied to a single
object and they're easier to use in higher-order constructs - getting
the above construct to work using "pure oo" only would get seriously
ugly very soon, see classic Java's sortable collections for instance.

As for using prototypes vs direct object properties; prototypes can be
shared so they're more efficient if you otherwise need to copy /
initialize a lot of properties. Also, they make it easy to extend
existing "classes of" objects:

this code from the mozilla developer site:

if (!Array.prototype.forEach) {
Array.prototype.forEach = function(fun, /* thisp */) {
var len = this.length;
if (typeof fun != "function")
throw new TypeError();
var thisp = arguments[1];
for (var i = 0; i < len; i++) {
if (i in this)
fun.call(thisp, this, i, this);
}
};
}

Joost.

 

[Steve Swift]

I'm just starting to learn about the prototype object in javascript
and I was wondering if someone could explain just in laymans terms why
you would use it instead of a regular functions? It seems like it does
the same thing as regular functions except in a more complicated way.

The general idea (it seems to me) behind these JavaScript libraries is
that you only have to learn how to do things once. If you try to do
things in native JavaScript you end up learning how to do it in Internet
Explorer, then Firefox, then Opera, then Sarfari, then …

 

[Joost Diepenmaat]

The general idea (it seems to me) behind these JavaScript libraries is
that you only have to learn how to do things once. If you try to do
things in native JavaScript you end up learning how to do it in
Internet Explorer, then Firefox, then Opera, then Sarfari, then …

I don't think the poster was talking about the Prototype.js library.

Then again, I could be wrong.

Joost.

 

[Thomas 'PointedEars' Lahn]

I'm just starting to learn about the prototype object in javascript
and I was wondering if someone could explain just in laymans terms why
you would use it instead of a regular functions?

It only seems as if there are regular functions. Globally declared
functions are in fact methods (callable properties) of the Global Object.
Locally declared functions are methods of the local Variable Object (that
can not be referred to).

It seems like it does the same thing as regular functions except in a more
complicated way.

Read on object-oriented programming to see the advantages of a reusable
encapsulation structure.

As for laymen terms, you can bite in every apple. Let bite() be a method of
people (with the target of biting as argument), or of apples (maybe with the
biting person or the size/form of the bit as argument).


HTH

PointedEars

 

[Joost Diepenmaat]

It only seems as if there are regular functions. Globally declared
functions are in fact methods (callable properties) of the Global Object.
Locally declared functions are methods of the local Variable Object (that
can not be referred to).

I prefer to state it more or less the the other way around; all
functions can be called as methods and as functions. A method call sets
the this object to something useful, a function call sets the this
object to null. he caller determines which of the two is used.

Poperty-lookup (if used) is responsible for the inheritance mechanism
which is independent of the actual calling. *

I find this a useful and practical view as a programmer. I'm not
claiming that this is exactly what happens in any implementation.

* obj.prop(arg) is just syntactic sugar for obj.prop.call(obj,arg) (and
yes, that's a circular definition, but JS is full of those edge cases).

Joost.

 

[Thomas 'PointedEars' Lahn]

I prefer to state it more or less the the other way around; all
functions can be called as methods and as functions. A method call sets
the this object to something useful, a function call sets the this
object to null. he caller determines which of the two is used.

Nonsense. As every function is a method and `null' has no properties, the
`this' value is never `null'.


PointedEars

 

[Joost Diepenmaat]

Nonsense. As every function is a method and `null' has no properties, the
`this' value is never `null'.

Oops, I forgot about the rule that said that if this is null or some
other non-object, it becomes the global object.

joost.

 

[VK]

Oops, I forgot about the rule that said that if this is null or some
other non-object, it becomes the global object.

Still not exactly right. null as argument is used in call() and
apply() methods to enforce the global context for callee. This way
"this" is never null, but null argument is used in some methods to get
a particular "this" state.

 

[Thomas 'PointedEars' Lahn]

Still not exactly right. null as argument is used in call() and
apply() methods to enforce the global context for callee. This way
"this" is never null, but null argument is used in some methods to get
a particular "this" state.

Unlike Joost, you have not understood ECMAScript Ed. 3, section 10.2.3,
among several other sections and aspects of the programming language.


PointedEars

 

[uncle_billy]

I'm just starting to learn about the prototype object in javascript
and I was wondering if someone could explain just in laymans terms why
you would use it instead of a regular functions? It seems like it does
the same thing as regular functions except in a more complicated way.

I think what the orginal poster was trying to ask is something like
this: what are the advantages to using one or the other of these?


var Car = function() {
this.wheels = 4;
this.moveForward = function() {
...
}
}

var Car = function() {
this.wheels = 4;
}
Car.prototype.moveForward = function() {
...
}

 

[Thomas 'PointedEars' Lahn]

I think what the orginal poster was trying to ask is something like
this: what are the advantages to using one or the other of these?

var Car = function() {
this.wheels = 4;
this.moveForward = function() {
...
}
}

var Car = function() {
this.wheels = 4;
}
Car.prototype.moveForward = function() {
...
}

Not quite. If we would assume as you do that every car had four wheels in
the beginning, it would probably be prudent to define that as an inherited
prototype property. And one would not use function *expressions* where not
necessary, of course.

function Car()
{
}

Car.prototype = {
constructor: Car,
wheels: 4,

moveForward: function()
{
...
}
};

And if that would have been the question, the answer would have been obvious:

You would gain at least some memory efficiency for losing at least some
runtime efficiency, because you would only need one Function object for all
Car objects but it would have to be looked up through the prototype chain on
each property access.


PointedEars

 

[Joost Diepenmaat]

You would gain at least some memory efficiency for losing at least some
runtime efficiency, because you would only need one Function object for all
Car objects but it would have to be looked up through the prototype chain on
each property access.

True. But note that the runtime property-lookup penalty will be offset
by having more efficient object creators. In other words, creating a lot
of objects with a lot of "interited" properties will be faster, and if
you only access a subset of all properties of all objects the total run
time /may/ be faster with prototype inheritance than without.

 

[Thomas 'PointedEars' Lahn]

True. But note that the runtime property-lookup penalty will be offset
by having more efficient object creators. In other words, creating a lot
of objects with a lot of "interited" properties will be faster, and if
you only access a subset of all properties of all objects the total run
time /may/ be faster with prototype inheritance than without.

But it is unlikely. Usually the object is created once, but the prototype
method is probably called more than once on the same object.

However, in order not to be misunderstood, I recommend using prototype
methods unless a closure in the constructor increases efficiency when
calling the method. Because ISTM processing time is a lot cheaper than
memory nowadays.


PointedEars