JavaScript Scope

Prototype Objects

In JavaScript, every object includes an internal reference to another object. This object is known as a prototype object. This system allows inheritance in JavaScript.

Example

Consider the following function:

function Name(first,last){
    this.first = first;
    this.last = last;
}

You can now create a prototype object to which all instances of name have access. You can create the prototype object anywhere in the code at any time; and all instances of the object inherit.

Name.prototype.completename = function() {return this.first + this.last;}

So the following is true.

var me = new Name("Ken","Mack");
me.hasOwnProperty("first");        //true: first is a direct property of me
me.hasOwnProperty("completename"); // false: completename is an inherited property of me, so it accesses a shared copy of the completename function.

So if you create 10 objects of type Name, only one object of completename is created, because it's shared (inherited) for all instances of Name.

Where it gets confusing is when you create a property that you can write to, with shared across all me instances. If you create a prototype property of middlename, for Name: Name.prototype.middlename="middlename", then do the following, because properties are read/write.

Name.prototype.middlename="middlename";
var me = new Name("Ken","Mack");
middlename = me.middlename;
var mywife = new Name("Laurie","Mack");
wifesmiddlename = mywife.middlename;

This example returns the string middlename for both instances, because they inherit that property and the value. While there are two instances of the Name object, me and mywife,, there is only one instance of middlename, and it's set to "middlename". However, you can then set middlename for me as follows:

me.middlename="Joseph";
middlename = me.middlename;          // middlename now equals "Joseph"
wifesmiddlename = mywife.middlename; //middlename is still "middlename"
mywife.middlename = "Epps";
wifesmiddlename = mywife.middlename; // wife's middlename is now "Epps"
middlename = me.middlename;          // middlename is still "Joseph"

Now there are two instances of Name, me and mywife, and two instances of middlename, one set to "Joseph" and one set to "Epps".

The prototype object is a way for instances of an object to inherit "shared" objects. However, when the object that is being inherited is a writeable property and the property is written to, updated or changed, the object gets its own copy of that object, so as not to interfere with each object's version of the property.