JavaScript: What are .extend and .prototype used for?

javascript prototype object-model
Andrew picture Andrew · Sep 23, 2010 · Viewed 134.8k times · Source

I am relatively new to JavaScript and keep seeing .extend and .prototype in third party libraries I am using. I thought it had to do with the Prototype javascript library, but I am beginning to think that is not the case. What are these used for?

Answer

meder omuraliev picture meder omuraliev · Sep 23, 2010

Javascript's inheritance is prototype based, so you extend the prototypes of objects such as Date, Math, and even your own custom ones.

Date.prototype.lol = function() {
 alert('hi');
};

( new Date ).lol() // alert message

In the snippet above, I define a method for all Date objects ( already existing ones and all new ones ).

extend is usually a high level function that copies the prototype of a new subclass that you want to extend from the base class.

So you can do something like:

extend( Fighter, Human )

And the Fighter constructor/object will inherit the prototype of Human, so if you define methods such as live and die on Human then Fighter will also inherit those.

Updated Clarification:

"high level function" meaning .extend isn't built-in but often provided by a library such as jQuery or Prototype.

Related questions

Extending an Object in Javascript

I am currently transforming from Java to Javascript, and it's a bit hard for me to figure out how to extend objects the way I want it to do. I've seen several people on the internet use a method called …

Read More
__proto__ VS. prototype in JavaScript

This figure again shows that every object has a prototype. Constructor function Foo also has its own __proto__ which is Function.prototype, and which in turn also references via its __proto__ property again to the Object.prototype. Thus, repeat, Foo.…

Read More
Parse JSON String into a Particular Object Prototype in JavaScript

I know how to parse a JSON String and turn it into a JavaScript Object. You can use JSON.parse() in modern browsers (and IE9+). That's great, but how can I take that JavaScript Object and turn it into a …

Read More