A short guide to Object creation pattern in JavaScript

---

Object creation mechanisms increase the flexibility and reuse of existing code. Here in this post, we will see the Object Creation Pattern in JavaScript.

---

Some patterns to create an object are:

• Factory pattern
• Constructor pattern
• Prototype pattern
• Constructor / Prototype pattern

---

Factory Pattern

The factory pattern uses a function to abstract away the process of creating specific objects and returning their reference. It returns a new instance whenever called.

function createFruit(name) {
    const obj = new Object(); 
    obj.name = name; 
    obj.showName = function () {
        console.log("I'm " + obj.name); 
    }
    return obj; 
}

const fruitOne = createFruit('Apple'); 
const fruitTwo = createFruit('Orange'); 

fruitOne.showName(); // I'm Apple
fruitTwo.showName(); // I'm Orange

---

Constructor Pattern

In the constructor pattern, instead of returning the instance from the function, we use the new operator along with the function name.

function createFruit(name) {
    this.name = name; 
    this.showName = function () {
        console.log("I'm " + this.name); 
    }
}

const fruitOne = new createFruit('Apple'); 
const fruitTwo = new createFruit('Orange'); 

fruitOne.showName(); // I'm Apple
fruitTwo.showName(); // I'm orage

---

Prototype Pattern

The prototype pattern adds the properties of the object to the properties that are available and shared among all instances.

function Fruit(name) {
    this.name = none; 
}

Fruit.prototype.showName = function() {
    console.log("I'm " + this.name); 
}

const fruitOne = new Fruit('Apple'); 
fruitOne.showName(); // I'm Apple

const fruitTwo = new Fruit('Orange'); 
fruitTwo.showName(); // I'm Orange

---

Constructor / Prototype pattern

This is a combination of the constructor and prototype patterns. The constructor pattern defines object properties, while the prototype pattern defines methods and shared properties.

function Fruit() { }

Fruit.prototype.name = name; 
Fruit.prototype.showName = function () {
    console.log("I'm " + this.name); 
}

const fruit = new Fruit(); 
fruit.name = 'Apple'; 
fruit.showName(); // I'm Apple

---

😎Thanks For Reading | Happy Coding😊