Common Coding Patterns

patterns.js

// PRIMITIVES (JavaScript -- 7)
// boolean null undefined number string symbol object

// FACTORY
// The Factory Pattern is a little dated (ES6 classes offer a pretty pain free way of defining classes and using default
// constructors with the 'new' keyword) however they do still see some use in modern web development and automation.
// Factories can be especially useful when designed to return objects/data structures common to certain test operations
// within an automation suite (i.e. mocking an object used to fill out all form fields with valid data).

function Car (options) {
  this.state = options.state || 'used';
  this.doors = options.doors || 4;
  this.color = options.color || 'red';
}

function Truck (options) {
  this.state = options.state || 'new';
  this.color = options.color || 'yellow';
  this.doors = options.doors || 2;
  this.wheels = options.wheels || 8;
}

// Define a skeleton factory first
function VehicleFactory() {}

// Define the default vehicle type the factory will create
VehicleFactory.prototype.vehicleClass = Car;
 
// Our Factory method for creating new Vehicle instances
VehicleFactory.prototype.createVehicle = function (options) {
 
  switch (options.vehicleType) {
    case "car":
      this.vehicleClass = Car;
      break;
      
    case "truck":
      this.vehicleClass = Truck;
      break;
  }
  
  return new this.vehicleClass(options);
};
 
// Create an instance of our factory that makes cars
const carFactory = new VehicleFactory();
let car = carFactory.createVehicle( { vehicleType: "car", color: "yellow", doors: 6 } );

// DECORATORS
// A decorator is a structural design pattern that aims to promote code re-use. Decorating an object in JavaScript is pretty
// straight forward since one can easily extend an object by defining a new method on it,
// for example car.setModel = (name) => { this.model = name } would add a setModel decorator to our car object.
// Their true potential is unlocked through the combined use of multiple decorators as in the following example, where the
// original constructor is left in tact (unchanged) but the instance is modified (decorated) by using certain upgrade methods

// Constructor
function MacBook() {
  this.cost = () => 999;
  this.screenSize = () => 11.6;
  this.insured = () => false;
  this.memory = () =>'8gb';
  this.engraving = () => '';
}
 
// Decorator 1
function memory(macbook) { 
  let cost = macbook.cost();
  macbook.memory = () => '16gb';
  macbook.cost = () => cost + 75;
}
 
// Decorator 2
function engraving(macbook, text) {
  let cost = macbook.cost();
  macbook.engraving = () => text;
  macbook.cost = () => cost + 200;
}
 
// Decorator 3
function insurance(macbook) {
  let cost = macbook.cost();
  macbook.insured = () => true;
  macbook.cost = () => cost + 250;
}
 
let mb = new MacBook();
memory(mb);
engraving(mb);
insurance(mb);
 
mb.cost();    // Outputs: 1524
mb.memory();  // Outputs: 16gb
mb.insured(); // Outputs: true

// SINGLETON
// The Singleton pattern guarantees that only a single instance of a given object will ever be instantiated, which is useful
// if the object has a specific task or function that needn't be replicated and should be persistent and available at all times,
// for example a framework or library will rarely, if ever, require multiple copies of itself. In JavaScript, Singletons serve
// as a shared resource namespace which isolate implementation code from the global namespace and provide a single point
// of access for functions.

const singleton = (function() {
  let instance;
  
  function init() {
    
    function privateMethod() {
      console.log("private method");
    }
  
    let privateRandomNumber = Math.random();
  
    return {
      publicMethod: () => {
        console.log("public method");
      },
    
      publicProperty: "public property",
    
      getRandomNumber: () => privateRandomNumber;
    }
    
    return {
      getInstance: function () {
        if (!instance) instance = init(); // fundamental check, this is what makes this a singleton
        return instance;
      }
    }
  }
})(); // immediately invoked function