How to implement the builder pattern in Javascript

Overview

The builder pattern is a relatively simple design pattern and belongs to a creational pattern.

Definition: Decompose a complex object into multiple simple objects for construction, separate the complex construction layer from the presentation layer, so that the same construction process can create different presentation modes;

advantage:

• The builder pattern has better encapsulation, and object creation and construction processes are decoupled;
• The builder pattern is easy to expand. When we need to expand, we can do it through a new builder.

Mode function:

• Creating a complex object step by step
• Decouple the packaging process from the specific creation of components
• No need to worry about how the components are assembled

Note:

• Must have a stable algorithm support
• The processing technology is exposed, which means that the rich can go and see how the house is built at any time.

Vernacular explanation:

A rich man wants to build a house. He only needs to find a contractor, who will then find a construction team to build the house. He does not need to find workers one by one to build a construction team and start construction. The contractor knows the rich man's needs and also knows where to find workers to build a construction team. The workers can work directly, saving the rich man the cost of communicating directly with the workers. The rich man does not need to know how to build a house. He only needs to be able to inspect the house in the end.

Code Implementation

Before writing the code, let's analyze it first:

1. The output is a house

2. The contractor calls the workers to start the work and he must be very clear about the specific major project of the workers.

3. Workers are house builders who can build bedrooms, living rooms and kitchens.

4. The contractor is just an interface. He only tells others to build a house, but he doesn't have to do anything.

function Fangzi(){
    this.woshi = "";
    this.keting = "";
    this.chufang = "";
}

function Baogongtou(){
    this.jianfangzi = function(gongren){
        gongren.jian_woshi();
        gongren.jian_keting();
        gongren.jian_chufang();
    }
}

function Gongren(){
    this.jian_woshi = function(){
        console.log("The bedroom is built!");
    }

    this.jian_keting = function(){
        console.log("The living room is built!");
    }

    this.jian_chufang = function(){
        console.log("The kitchen is built!");
    }

    this.wangong = function(){
        var fangzi = new Fangzi();
        fangzi.woshi = "ok";
        fangzi.keting = "ok";
        fangzi.chufang = "ok";
        return fangzi;
    }
}
let gongren = new Gongren();
let baogongtou = new Baogongtou();
//The bedroom is finished!
//The living room is built!
//The kitchen is built!
baogongtou.jianfangzi(gongren);
var my_fangzi = gongren.wangong();
/*
Fangzi=
       Chufang: "ok"
       keting: "ok"
       woshi: "ok"
       }
*/
console.log(my_fangzi);

In the above code, we can see that Gongren() contains the specific construction process, that is, the specific things to do. Fangzi() is empty at the beginning, without a living room, kitchen, or bedroom. Baogongtou() only advertises that a house can be built, and then passes in the worker method to call the worker to do the construction. When the worker method is executed, the construction is completed, and then the house is handed over. Instantiate the Fangzi() method in a new method and reassign it in the new method.

The above is the details of how to implement the builder pattern with Javascript. For more information about the Javascript builder pattern, please pay attention to other related articles on 123WORDPRESS.COM!