Nhan Nguyen's blog

JavaScript Design Patterns - Creational - Prototype

Nhan Nguyen's photo
Nhan Nguyen
·

1 min read

Prototype pattern creates new objects based on an existing one with default property values.

In the example below, we can use the clone() method to create a new object Fruit with the same name and weight as its parent.

class Fruit {
  constructor(name, weight) {
    this.name = name;
    this.weight = weight;
  }

  clone() {
    return new Fruit(this.name, this.weight);
  }
}
export default Fruit;

👉 Use this pattern when:

➖ Our code should not depend on the concrete classes of objects that you need to copy.

➖ We want to reduce the number of subclasses that only differ in how they initialize their respective objects.

🚀 Pros:

➖ We can clone objects without coupling to their concrete classes.

➖ We can eliminate repeated initialization code in favor of cloning pre-built prototypes.

➖ We can produce complex objects more conveniently.

➖ We get an alternative to inheritance when dealing with configuration presets for complex objects.

⛔ Cons:

➖ Cloning complex objects that have circular references might be very tricky.

I hope you found it useful. Thanks for reading. 🙏

Let’s get connected! You can find me on:

Programming BlogsJavaScriptBeginner Developers