search

Prototype Pattern

The prototype pattern is a creational design pattern in software development. It is used when the type of objects to create is determined by a prototypical instance, which is cloned to produce new objects. This pattern is used to:

To implement the pattern, declare an abstract base class that specifies a pure virtual clone() method. Any class that needs a “polymorphic constructor” capability derives itself from the abstract base class, and implements the clone() operation.

The client, instead of writing code that invokes the new operator on a hard-coded class name, calls the clone() method on the prototype, calls a factory method with a parameter designating the particular concrete derived class desired, or invokes the clone() method through some mechanism provided by another design pattern.

Structure

Prototype Pattern diagram

The objects participating in this pattern are:

Example

In the sample code we have a CustomerPrototype object that clones objects given a prototype object. Its constructor function accepts a prototype of type Customer. Calling the clone method will generate a new Customer object with its property values initialized with the prototype values.

This is the classical implementation of the Prototype pattern, but JavaScript can do this far more effectively using its built-in prototype facility.

function CustomerPrototype(proto) {
  this.proto = proto;
 
  this.clone = function () {
    var customer = new Customer();
 
    customer.first = proto.first;
    customer.last = proto.last;
    customer.status = proto.status;
 
    return customer;
  };
}
 
function Customer(first, last, status) {
  this.first = first;
  this.last = last;
  this.status = status;
 
  this.say = function () {
    alert('name: '
      + this.first
      + ' '
      + this.last
      + ', status: '
      + this.status
    );
  };
}
 
function run() {
  var proto = new Customer('n/a', 'n/a', 'pending');
  var prototype = new CustomerPrototype(proto);
  var customer = prototype.clone();
  customer.say();
}

run();

Source: