JavaScript Design Patterns - Prototype Pattern

JavaScript Design Patterns - Prototype Pattern

Prototype pattern allows you to mimic the class based inheritance model offered by modern O-O languages. Anyways there are limitations to that. The following are the features offered by prototype pattern.

• Normal functions can act as constructors to instantiate objects. (This is achieved through the “new” keyword);
• Provides a means for inheritance. (Using an object’s prototype).

Lets try to build the tooltip using Prototype pattern. Firstly we create a simple tooltip with the core functionalities. Later on we move on to extend the simple tooltip to override it to make a special tooltip that showcases “fading” behavior.

Our html should be like this. (Of course we need jQuery for the DOM manipulation stuffs..)

{ gist vigneshjayavel/9910804 }

Our JS should be like this.

{ gist vigneshjayavel/9910794 }