Javascript Design Patterns

Introduction

Design patterns are advanced object-oriented solutions to commonly occurring software problems. Patterns are about reusable designs and interactions of objects. Each pattern has a name and becomes part of a vocabulary when discussing complex design solutions.

The 23 Gang of Four (GoF) patterns are generally considered the foundation for all other patterns. They are categorized in three groups: Creational, Structural, and Behavioral (see below for a complete list).

In this tutorial we provide JavaScript examples for each of the GoF patterns. Mostly, they follow the structure and intent of the original pattern designs. These examples demonstrate the principles behind each pattern, but are not optimized for JavaScript.

Algorithm

• Linked List

Design Patterns

• Creational patterns

  • Abstract Factory is a creational design pattern that lets you produce families of related objects without specifying their concrete classes.

  • Builder is a creational design pattern that lets you construct complex objects step by step. The pattern allows you to produce different types and representations of an object using the same construction code.

  • Factory Method is a creational design pattern that provides an interface for creating objects in a superclass, but allows subclasses to alter the type of objects that will be created.

  • Prototype is a creational design pattern that lets you copy existing objects without making your code dependent on their classes.

  • Singleton is a creational design pattern that lets you ensure that a class has only one instance, while providing a global access point to this instance.

• Structural patterns

  • Adapter is a structural design pattern that allows objects with incompatible interfaces to collaborate.

  • Bridge is a structural design pattern that lets you split a large class or a set of closely related classes into two separate hierarchies—abstraction and implementation—which can be developed independently of each other.

  • Composite is a structural design pattern that lets you compose objects into tree structures and then work with these structures as if they were individual objects.

  • Decorator is a structural design pattern that lets you attach new behaviors to objects by placing these objects inside special wrapper objects that contain the behaviors.

  • Facade is a structural design pattern that provides a simplified interface to a library, a framework, or any other complex set of classes.

  • Flyweight is a structural design pattern that lets you fit more objects into the available amount of RAM by sharing common parts of state between multiple objects instead of keeping all of the data in each object.

  • Proxy is a structural design pattern that lets you provide a substitute or placeholder for another object. A proxy controls access to the original object, allowing you to perform something either before or after the request gets through to the original object.

• Behavioral patterns

  • Chain of Responsibility is a behavioral design pattern that lets you pass requests along a chain of handlers. Upon receiving a request, each handler decides either to process the request or to pass it to the next handler in the chain.

  • Command is a behavioral design pattern that turns a request into a stand-alone object that contains all information about the request. This transformation lets you pass requests as a method arguments, delay or queue a request’s execution, and support undoable operations.

  • Interpreter ``

  • Iterator is a behavioral design pattern that lets you traverse elements of a collection without exposing its underlying representation (list, stack, tree, etc.).

  • Mediator is a behavioral design pattern that lets you reduce chaotic dependencies between objects. The pattern restricts direct communications between the objects and forces them to collaborate only via a mediator object.

  • Memento is a behavioral design pattern that lets you save and restore the previous state of an object without revealing the details of its implementation.

  • Observer is a behavioral design pattern that lets you define a subscription mechanism to notify multiple objects about any events that happen to the object they’re observing.

  • State is a behavioral design pattern that lets an object alter its behavior when its internal state changes. It appears as if the object changed its class.

  • Strategy is a behavioral design pattern that lets you define a family of algorithms, put each of them into a separate class, and make their objects interchangeable.

  • Template Method is a behavioral design pattern that defines the skeleton of an algorithm in the superclass but lets subclasses override specific steps of the algorithm without changing its structure.

  • Visitor is a behavioral design pattern that lets you separate algorithms from the objects on which they operate.