Suppose you wrote some JavaScript that stored employee's details in Objects. You might have 20 items of data per employee. If one Object is used for each employee, that's 20 property values per Object, plus maybe 10 handy methods. Every time you add a new employee you have to set 20 properties and 10 methods on the new Object you create. That's a lot of typing. Especially when the methods are all the same for each employee (likely) and half the properties are the same for each employee. And all you'd have for your effort would be an Object, which doesn't sound much like an employee record.
The prototype property fixes this, along with another special use of functions—constructors. Here's an example of a constructor and a prototype:
function display_it()
{
document.write(this.name);
}
function Employee(name, age)
{
this.name = name;
this.age = age;
this.status = 'Full time';
}
Employee.prototype.address = 'JS Industries, Station St.';
Employee.prototype.contact = '012 345 6789';
Employee.prototype.job = "Appear indispensable";
Employee.prototype.display = display_it;
var person1 = new Employee("Doe, John", 47);
var person2 = new Employee("Doe, Jane", 45);
person1.display() + document.write(" " + person2.contact);
The function named Employee isn't an ordinary function, because it uses the special this variable. It could be used as a method, but not in this example—there isn't any Object property it's being assigned to. Instead it's being used with new to create an Object. So this function is put to a third use: neither function nor method, instead it is a constructor. The new operator assumes its argument is an object constructor and magically 'knows' the constructors name, which is the constructor function's name.
The Object created is a typical one except that the function Employee decorates it with extra properties automatically. If you create an object using 'new Object', you don't get any new properties automatically. So constructor functions add value to the normal object construction process.
The extra properties created by a constructor function can be based on function arguments, since all the usual function rules apply. Therefore, this constructor achieves two ends: firstly it saves typing by letting the script writer reuse the statements in the constructor each time an Object is created; secondly, it's a more meaningful word than just plain Object.
Constructors are only a half solution to the problem of too many properties per Object. If there were 20 properties and 10 methods per Employee object, that would be 30 arguments to the Employee constructor. That is hardly practical. Instead, there is a special property called prototype. Properties of the prototype property are copied magically into every Object created by the matching constructor. So the two variables person1 and person2 both contain the same address, contact, job and display properties, even though the Employee constructor didn't explicitly set them. Notice that the word prototype is only required once where each prototype property is declared. This is a little bit like var.
There's one other reason why constructors are useful. In Netscape Navigator 2.02 and Internet Explorer 3.02, you can manipulate existing Arrays, but you can't make one via 'new Array'. What you can do is make a special constructor that does an equivalent job. Here's how:
function MakeArray(size)
{
var num = 0;
this.length = size;
for (var num = 1; num <= size; num++)
this[num] = 0;
return this;
}In Navigator 2.02, the 'length' property won't be set either. However, the new versions 4.0x of Navigator and IE will support using 'new Array..' Techniques to overcome this kind of incompatibility are discussed later.