Implementation of the above Example using Builder Design Pattern
Implementation user Class:
Javascript
//Blueprint for creating a new user using User class class User { constructor(name) { this.name = name; this.age = null; this.weight = null; this.address = null; this.gender = null; } // Method to set Age of the user setAge(age) { this.age = age; return this; // Return the object for method chaining } // Method to set the Weight of the user setWeight(weight) { this.weight = weight; return this; // Return the object for method chaining } // Method to set the Address of the user setAddress(address) { this.address = address; return this; // Return the object for method chaining } // Method to set the gender of user setGender(gender) { this.gender = gender; return this; // Return the object for method chaining } //Method to finalize the user creation build() { if (!this.name) { throw Error('Name is required'); } return this; // Return the object for method chaining } printUser() { return `User: { name: ${this.name}, age: ${this.age}, weight: ${this.weight}, address: ${this.address}, gender: ${this.gender} }`; } } // Usage const user = new User('Abhishek').setAge(30).setGender('Male').build(); console.log(user.printUser()); |
Note: In build method, we have only checked for name but we can also add more checks
Explanation of the above example using Builder Design Pattern:
User Class Definition:
Javascript
class User { constructor(name) { this.name = name; this.age = null; this.weight = null; this.address = null; this.gender = null; } } |
Here, a User class is defined with a constructor that takes a name parameter and initializes other user attributes (age, weight, address, gender) to null.
Setting User Attributes:
Javascript
setAge(age) { this.age = age; return this; } setWeight(weight) { this.weight = weight; return this; } setAddress(address) { this.address = address; return this; } setGender(gender) { this.gender = gender; return this; } |
These set methods allow you to set the user’s age, weight, address, and gender. They update the corresponding attributes and return the object to enable method chaining.
Finalizing User Creation:
Javascript
build() { if (!this.name) { throw Error('Name is required'); }return this; // Return the object for method chaining } |
The build method is used to finalize user creation. It checks if the name is provided and throws an error if it’s not. It returns the object to allow method chaining.
Printing User Information:
Javascript
printUser() { return `User: { name: ${this.name}, age: ${this.age}, weight: ${this.weight}, address: ${this.address}, gender: ${this.gender} }`; } |
The printUser method generates a string representation of the user’s information.
Usage:
Javascript
const user = new User('Abhishek').setAge(30).setGender('Male').build(); console.log(user.printUser()); |
This creates a new user with the name “Abhishek”, sets the age to 30, and sets the gender to “Male”. Then the build method is called to finalize user creation. Finally, the printUser method is used to print the user’s information to the console.
Output:
User: { name: Abhishek, age: 30, weight: null, address: null, gender: Male }
Implementation using Function:
Javascript
// Factory function to create a user object function createUser(name) { const user = { name, age: null, weight: null, address: null, gender: null, // Method to set the age of the user setAge(age) { this.age = age; return this; // Return the object for method chaining }, // Method to set the weight of the user setWeight(weight) { this.weight = weight; return this; // Return the object for method chaining }, // Method to set the address of the user setAddress(address) { this.address = address; return this; // Return the object for method chaining }, // Method to set the gender of the user setGender(gender) { this.gender = gender; return this; // Return the object for method chaining }, // Method to finalize the user creation build() { if (!this.name) { throw Error('Name is required'); // Validate required properties } return this; // Return the object for method chaining }, // Method to display the user information as a string printUser() { return `User: { name: ${this.name}, age: ${this.age}, weight: ${this.weight}, address: ${this.address}, gender: ${this.gender} }`; } }; return user; // Return the user object } // Usage: Create a user object and set properties const user = createUser('Abhishek') .setAge(30) .setWeight(70) .setAddress('India') .setGender('Male') .build(); // Finalize user creation console.log(user.printUser()); // Display user information |
Below is the explanation of the above code:
Factory Function to Create User Object:
Javascript
function createUser(name) { const user = { ... }; // Object with user properties and methods return user; // Return the user object } |
Here, a factory function createUser is used to create and initialize objects. The function takes a name parameter and returns a user object with properties and functions .
Setting User Attributes:
Javascript
setAge(age) { this.age = age; return this; } setWeight(weight) { this.weight = weight; return this; } setAddress(address) { this.address = address; return this; } setGender(gender) { this.gender = gender; return this; } |
These sets functions allow you to set the user’s age, weight, address, and gender. They update the corresponding attributes and return the object to enable function chaining.
Finalizing User Creation:
Javascript
build() { if (!this.name) { throw Error('Name is required'); }return this; // Return the object for method chaining } |
The build functions is used to finalize user creation. It checks if the name is provided and throws an error if it’s not. It returns the object to allow function chaining.
Printing User Information:
Javascript
printUser() { return `User: { name: ${this.name}, age: ${this.age}, weight: ${this.weight}, address: ${this.address}, gender: ${this.gender} }`; } |
The printUser function generates a string representation of the user’s information.
Usage:
Javascript
const user = new User('Abhishek').setAge(30).setGender('Male').build(); console.log(user.printUser()); |
- This creates a new user with the name “Abhishek”, sets the age to 30, sets the gender to “Male”, sets the address to India and weight to 70.
- Then build function is called to finalize user creation.
- Finally, the printUser function is used to print the user’s information to the console.
Output:
Javascript
User: { name: Abhishek, age: 30, weight: 70, address: India, gender: Male } |
Builder Method | JavaScript Design Pattern
The Builder design pattern is a creational design pattern used to construct complex objects by separating the construction process from the actual representation. It’s especially useful when an object requires multiple steps or configurations to be created.
Important Topics for the Builder Design Pattern in JavaScript Design Pattern
- Example without using the Builder Design Pattern
- Implementation of the above Example using Builder Design Pattern
- Advantages of the Builder Design Pattern:
- Disadvantages of the Builder Design Pattern:
- Where to Use the Builder Design Pattern:
- Where Not to Use the Builder Design Pattern:
Contact Us