Design Patterns JavaScript

Collection of 23 (GoF) design patterns implemented in JavaScript using both prototype and ES6 classes.

Patterns

The patterns can be divided in three different categories.

Creational patterns provide ways to instantiate single objects or groups of related objects.

  • Abstract Factory - provides an interface for creating families of related or dependent objects without specifying their concrete classes. Read more.

  • Builder - separates the construction of a complex object from its representation, allowing the same construction process to create various representations. Read more.

  • Factory method - defines an interface for creating a single object, but let subclasses decide which class to instantiate. Factory Method lets a class defer instantiation to subclasses. Read more.

  • Prototype - specify the kinds of objects to create using a prototypical instance, and create new objects from the 'skeleton' of an existing object, thus boosting performance and keeping memory footprints to a minimum. Read more.

  • Singleton - ensure a class has only one instance, and provide a global point of access to it. Read more.

Structural patterns concern class and object composition. They use inheritance to compose interfaces and define ways to compose objects to obtain new functionality.

  • Adapter - allows classes with incompatible interfaces to work together by wrapping its own interface around that of an already existing class. Read more.

  • Bridge - decouples an abstraction from its implementation so that the two can vary independently. Read more.

  • Composite - composes zero-or-more similar objects so that they can be manipulated as one object. Read more.

  • Decorator - dynamically adds/overrides behaviour in an existing method of an object. Read more.

  • Facade - provides a simplified interface to a large body of code. Read more.

  • Flyweight - reduces the cost of creating and manipulating a large number of similar objects. Read more.

  • Proxy - provides a placeholder for another object to control access, reduce cost, and reduce complexity. Read more.

  • Chain of responsibility - delegates commands to a chain of processing objects. Read more.

  • Command - creates objects which encapsulate actions and parameters. Read more.

  • Interpreter - implements a specialized language. Read more.

  • Iterator - accesses the elements of an object sequentially without exposing its underlying representation. Read more.

  • Mediator - allows loose coupling between classes by being the only class that has detailed knowledge of their methods. Read more.

  • Memento - provides the ability to restore an object to its previous state (undo). Read more.

  • Observer - is a publish/subscribe pattern which allows a number of observer objects to see an event. Read more.

  • State - allows an object to alter its behavior when its internal state changes. Read more.

  • Strategy - allows one of a family of algorithms to be selected on-the-fly at runtime. Read more.

  • Template - method defines the skeleton of an algorithm as an abstract class, allowing its subclasses to provide concrete behavior. Read more.

  • Visitor - separates an algorithm from an object structure by moving the hierarchy of methods into one object. Read more.