Every object constructor has a special property ‘prototype’ in Javascript (Please do not confuse it with prototype javascript library). Lets use it:

function myClass() {
}
myClass.prototype.aProperty = "foo";
var myObject = new myClass();
alert(myObject.aProperty);

This adds aProperty to the definition of myClass. The ‘prototype’ adds this property to all the objects whether they have been created or not. So, this example will work too:

function myClass() {
}
var myObject = new myClass();
myClass.prototype.aProperty = "foo";
alert(myObject.aProperty);

The ‘prototype’ object loads before the object’s constructor does anything.

function myClass() {
	this.aProperty = "bar";
}
var myObject = new myClass();
myClass.prototype.aProperty = "foo";
alert(myObject.aProperty);
// this alert will show "bar"

So, using ‘prototype’ we cannot override the properties and methods already defined in the object’s constructor.

We can use the ‘prototype’ to add functionalities to the already existing classes. Lets add some functionality to the String class.

String.prototype.vowelLength = function() {
	var count = 0;
	for(i=0; i < this.length; i++) {
		var l = this.charAt(i); 
		if(l == "a" || l == "A" || l == "e" || l == "E" || l == "i" || l == "I" || l == "o" || l == "O" || l == "u" || l == "U") {
			count++;
		}
	}
	return count;
}
var myString = "United States of America";
alert(myString.vowelLength());

Lets start Object Oriented Programming in Javascript

Simplest class:

function myFirstClass() {
}

var myObject = new myFirstClass();
myObject.someProperty = "This is value 1";
alert(myObject.someProperty);

We can create another instance of myFirstClass like this:

var anotherObject = new myFirstClass();
anotherObject.someProperty = "This is property of another class";

Lets take the property to the definition of our class

function myFirstClass(property1) {
	this.someProperty = property1;
}

var myObject = new myFirstClass("Hello World!");
alert(myObject.someProperty);

Now we will introduce some methods of our class

function method1_myFirstClass() {
	alert("This is method 1 of my first class");
}

function myFirstClass(property1) {
	this.someProperty = property1;
	this.method1 = method1_myFirstClass;
}

var myObject = new myFirstClass("Hello World!");
myObject.method1();

Now we will write it within our class definition

function myFirstClass(property1) {
	this.someProperty = property1;
	this.method1 = function() {
		alert("This is method 1 of my first class");
	};
}

var myObject = new myFirstClass("Hello World!");
myObject.method1();

Now we have seen a new way of writing functions. Why not write our class in this way too.

var myFirstClass = function(property1) {
	this.someProperty = property1;
	this.method1 = function() {
		alert("This is method 1 of my first class");
	};
}

var myObject = new myFirstClass("Hello World!");
myObject.method1();

I will share advanced features related to OOP javascript in my coming posts. 

Stay tuned!

// Using abbreviation of DotToString = DTS
if (typeof DTS == "undefined")
{
	var DTS = {};
}

// Make a function for creating namespaces
DTS.namespace = function() {
	var a=arguments, o=null, i, j, d;
	for (i=0; i<a.length; i=i+1) {
		d=a[i].split(".");
		o=DTS;

		// DTS is implied, so it is ignored if it is included
		for (j=(d[0] == "DTS") ? 1 : 0; j<d.length; j=j+1) {
			o[d[j]]=o[d[j]] || {};
			o=o[d[j]];
		}
	}

	return o;
};

and thats all

Now you can create your own namespaces like this:

// We can mention our top level namespace
DTS.namespace("DTS.UI.Example");

// or we can just skip top level namespace
DTS.namespace("UI.widgets");

// or we can have a hybrid case
DTS.namespace("DTS.UI.Example", "UI.widgets");