DirigoEdge
J.P. Berry
by J.P. Berry
share this
?fl
« Back to the Blog

Javascript Prototype Keywords

03/04/2014
Javascript Prototype Keywords

You’ve all come across the Javascript prototype keyword by now. We probably use this syntax almost every day, and I want to make sure everyone knows why we use it, and how powerful it can be outside of simply having a unified structure.

In DirigoEdge, we create a “class” (Javascript is class-free, hence the air quotes) structure that utilizes an object’s prototype in order to achieve multiple inheritance and some other powerful features of object-oriented languages.

The syntax we use typically looks like this :

// This acts as a constructor
main_class = function () {
    this.height = 1000; // Public Property

    var x = "testing"; // Private Property
};

main_class.prototype.initPageEvents = function() {

};

// One way to instantiate the class :
$(document).ready(function () {
    myMain = new main_class();
    myMain.initPageEvents();
});

You can write some syntactic sugar methods if you don’t like the function prototype syntax. So you could write your initPageEvents method like this if you were really keen on it :

myMain.method("initPageEvents", function() {
    // Function body here
});

Multiple inheritance allows us to create “classes” that are built from methods of other classes. We can also extend objects without having to instantiate them.

Another benefit of using the prototypal scheme is that it’s much lighter than using an object literal pattern. When you instantiate an object from an object literal, you are literally copying that method over for every object you instantiate. If you use a prototype, that method is shared between instances. It’s an important distinction to make.

Douglas Crockford has an excellent article that I highly recommend reading. John Resig also has a similar article, but his implementation relies on using jQuery’s .extend() which, while is brilliant in it’s implementation, is a bit more difficult to read than Crockford’s syntax, and requires a bit more thorough understanding of how .extend() works (which he details in length in his post). They are both excellent reads, and Resig and Crockford are easily two of the most influential Javascript developers out there. Their books are also worth picking up.

Thanks!

Thank you for contacting us!

We'll be in touch!

Back Home ×