In the constructor method, we create an object using the new keyword. In this method, we define properties and methods with the this keyword. Properties are defined after the = sign. When you define each property, you must place a semicolon at the end. When you use the this method in your script, you need to first initialize the object and then use it in your code:

Modules can be implemented in several ways in JavaScript. We will be discussing two of them here:

varObjectLiteral = {
  variableKey: Value,

  functionKey: function() {
    //...
  }
};

myModule.property = 'someValue';

Christian Heilmann engineered this pattern. He disliked the fact that we had to switch to object literal notation for the objects that we want to keep public. There was another drawback: we had to repeat the name of main object if we had to access public variables from one method into an other or call public methods.

In this pattern, we define all functions and variables as private and, at the end of module, return an anonymous object along with the pointers to the private functions and variables we would like to expose as public.

Here are a few advantages and disadvantages of the revealing module pattern:

Advantages:

Disadvantages:

The singleton pattern is implemented by creating a class with a method whose object can only be created if it doesn't exist already. If the object already existed, the reference will be returned to that object.

It is recommended to delay the initialization of singletons in cases where they require some information that might not be available at the time of initialization. Hence, they are different from static classes or objects.

Here are a few advantages and disadvantages of the singleton pattern:

Advantages:

Disadvantages:

In the observer pattern, an object (also called a subject/publisher) is connected to multiple other objects that are dependent on our subject. These depending objects are called observers/subscribers.

The subject broadcasts a notification whenever a change in state occurs. All observers receive the notification and update them accordingly.

The book, Design Patterns: Elements of Reusable Object-Oriented Software, describes the observer pattern as follows:

Here are a few advantages and disadvantages of the observer pattern:

Advantages:

Disadvantages:

The mediator pattern promotes loose coupling by ensuring that, instead of objects interacting with each other directly, they communicate across a central point.

Let's take a real-world example to understand it in a better way. Consider an airport traffic-control system. The control tower acts as a mediator, while all other planes are communicating with the control tower and waiting for the notifications to land or to take off. They do not contact each other but just with the control tower. The role of the control tower is very essential and central. Hence, it an important key for this system.

Similarly, the mediator is as important in this pattern.

When we call mediator's subscribe method, we pass in a callback, and the mediator queues up these callbacks for when the given event is fired and subsequently the decoupled object's callback is fired. Mediator triggers the signal for the object to fire, allowing the object to be decoupled from any others.

Here are a few advantages and disadvantages of the mediator pattern:

Advantages:

Disadvantages:

This pattern focuses on creating an object that can be used as a template/blueprint for other objects through prototypal inheritance. JavaScript has native support for prototypal inheritance. Therefore, it's easy to work in this pattern.

Here are a few advantages and disadvantages of the prototype pattern:

Advantages:

Disadvantages:

Command objects allow loosely coupled systems to separate objects that issue requests from the objects that process requests. These requests are known as events and the code that processes these requests is called an event handler.

In simpler words, we can say that the main purpose of the command pattern is separating the features of giving out commands from executing commands and delegating this feature to a different object. Practically, command objects bind an action to the object that will invoke the action. They always include a function such as run() or execute(). One of the biggest advantages of this pattern is that command objects with the same interface can be easily interchanged whenever needed.

Advantages:

Disadvantages:

It is useful while creating structures where generation and execution of requests do not depend on each other. We can say that a command instance can be instantiated by the client and run later by the invoker. The client and invoker may not know anything about each other.

This pattern is scalable as we can add new commands without changing any existing code.

The façade pattern is a structural pattern that enables us to hide the backend complexities under an interface. This pattern increases usability of the application modules. Internal features and methods are not exposed directly to developers, but they can interact with them through this façade. This pattern makes your application secure.

jQuery is an example of a JavaScript library that uses the façade pattern.

Whenever we use jQuery's $(this).animate() or $(this).css() function, we are using a façade. Similarly, $(document).ready() implements a façade.

The core jQuery attributes should be considered intermediate abstractions. The more immediate burden to developers is the DOM API and facades are what make the jQuery library so easy to use.

The ready() function has lots of complexities at the backend. jQuery simplifies browser inconsistency to ensure that ready() is invoked at the appropriate time.

However, we only see a façade or a simple interface layer.

Here are a few advantages and disadvantages of the facade pattern:

Advantages:

Disadvantages:

The factory pattern provides an interface for object creation where we specify the type of factory object we need to create. Subclasses are allowed to decide which class will be instantiated so that they can specify which type of factory object will be created. Factory pattern is very extensible. Factory methods are used when collection of objects are being maintained. These collection of objects are different but still have many common methods and properties.

In this pattern, we do not use the new keyword to create an object.

Let's take a real-time example that will clarify this pattern:

Suppose there is a garment factory. We need to create a type of garment. Instead of creating this object directly using the new keyword, we will request a factory object for a new garment. We tell the factory which type of object is needed (a shirt, jeans, coat, a scarf, and so on). It instantiates that class and returns the object for our further usage.

ExtJS is a JavaScript library that uses this pattern. Methods for creating objects can be categorized and further sub classed.

Here are a few advantages and disadvantages of the factory pattern:

Advantages:

Disadvantages:

Subclassing means to inherit properties for our new object from a super or base class object.

For instance, there is an apple class that is able to extend from another class, fruit. Here, fruit is a superclass, while apple is a subclass of fruit. All objects of apple inherit properties from fruit. However, apple is able to define its own methods and override those defined by fruit.

If apple needs to call an overridden method in fruit, it's called method chaining.

If apple needs to call fruit's constructor, it's called constructor chaining.

Mixins let other objects inherit their functionality with a very minimal level of complexity. This pattern allows us to share functionalities from many mixins through multiple inheritance.

Here are a few advantages and disadvantages of the mixin pattern:

Advantages:

This pattern helps in decreasing function duplication and promotes reuse of functions. In applications where functionality is shared across the system, we can put the shared functions in mixins and focus on the rest of the distinct functionality in our system.

Disadvantages:

Keeping functionality in the object prototype may result in prototype pollution and may confuse tracking the origin of our functions. This may cause problems in large-scale applications.

Example:

// Detailed explanation of Mixin Design Pattern in JavaScript can be found here: http://addyosmani.com/resources/essentialjsdesignpatterns/book/#mixinpatternjavascript

/* Car Class */
var Car = function(settings) {
    this.model = settings.model || 'no model provided';
    this.colour = settings.colour || 'no colour provided'; 
};

/* Mixin Class */
var Mixin = function(){};
Mixin.prototype = {
    driveForward: function() {
        console.log('drive forward');
    },
    driveBackward: function() {
        console.log('drive backward');        
    }
};

/* Augment existing class with a method from another class */
function augment(receivingClass, givingClass) {
    /* only provide certain methods */
    if(arguments[2]) {
        var i, len = arguments.length;
        for (i=2; i<len; i++) {
            receivingClass.prototype[arguments[i]] = givingClass.prototype[arguments[i]];   
        }
    } 
    /* provide all methods */
    else {
        var methodName;
        for (methodName in givingClass.prototype) {
            /* check to make sure the receiving class doesn't have a method of the same name as the one currently being processed */
            if (!receivingClass.prototype[methodName]) {
                receivingClass.prototype[methodName] = givingClass.prototype[methodName];   
            }
        }
    }
}

/* Augment the Car class to have the methods 'driveForward' and 'driveBackward' */
augment(Car, Mixin, 'driveForward', 'driveBackward');

/* Create a new Car */
var vehicle = new Car({model:'Ford Escort', colour:'blue'});

/* Test to make sure we now have access to the methods */
vehicle.driveForward();
vehicle.driveBackward();