Danh mụcThẻBài viết

admin

I'm a Full-stack developer

Thẻ

Linked List
Data Structure
Chat GPT
Design Pattern
Microservices
API
AWS CDK
ReactJS
AWS Lightsail
Flutter Mobile
TypeScript Design Pattern - Prototype
Ngày đăng: 07/08/2023

What is a prototype pattern?


The prototype pattern is one of the Creational pattern groups. The responsibility is to create a new object through clone the existing object instead of using the new key. The new object is the same as the original object, and we can change its property does not impact the original object.


When should I use the prototype pattern?


The singleton pattern should be used when a developer wants to:


  • Initialize an object that is the same as the original object without using a new operator or constructor because we could be missing some properties of the original object leading to the new key does not use.
  • Initialize object at run-time.
  • The properties to init an object is complex.


How to implement


For example, we will define a class that has the responsibility to generate a CSV file with a header and name.


export class ExportCsvFile {
  public _name: string;
  public _headers: string[] = ['#', 'Username', 'Email'];
  
  constructor(name: string, headers: string[]) {
    this._name = name;
    this._headers = [...this._headers, ...headers];
  }


  public clone(): this {
    return Object.create(this);
  }
}


const csvFile1 = new ExportCsvFile('CSV 1', []);
console.log(csvFile1._name);
console.log(csvFile1._headers);


const csvFile2 = csvFile1.clone();
csvFile2._name = 'CSV 2'
csvFile2._headers = [...csvFile2._headers, 'Is Activate', 'Last Login'];
console.log(csvFile2._name);
console.log(csvFile2._headers);


Execution result

CSV 1

[ '#', 'Username', 'Email' ]

CSV 2

[ '#', 'Username', 'Email', 'Is Activate', 'Last Login' ]


Pros and Cons

Pros:


  • You can clone objects without coupling to their concrete classes.
  • You can get rid of repeated initialization code in favor of cloning pre-built prototypes.
  • You can produce complex objects more conveniently.
  • You 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.


Wrapping Up


Thank you for reading, and happy coding!

I hope this article will help make the concepts of the Prototype Pattern

Đề xuất

TypeScript Design Pattern - Builder
admin07/08/2023

TypeScript Design Pattern - Builder
TypeScript Design Pattern - Builder
Create S3 Bucket with AWS CDK
admin09/06/2023

Create S3 Bucket with AWS CDK
In this article, I introduce Amazon CDK and how to write AWS infrastructure-as-code using TypeScript. We will do it step by step.
TypeScript Design Pattern - Adapter
admin08/08/2023

TypeScript Design Pattern - Adapter
This design pattern acts as a bridge between two different interfaces.
Mới nhất

Part 4: Creating Static Home Page on Ghost CMS
admin17/06/2023

Part 4: Creating Static Home Page on Ghost CMS
I believe that many of you are asking the question: How to fix the home page of Ghost CMS as desired? and are struggling to find many different sources of documentation.
Part 1: How to deploy Ghost Blog on AWS using Lightsail
admin17/06/2023

Part 1: How to deploy Ghost Blog on AWS using Lightsail
In this article, I want to introduce about how to deploy Ghost Blog on AWS using Lightsail.
TypeScript Design Pattern - Abstract Factory
admin07/08/2023

TypeScript Design Pattern - Abstract Factory
The abstract factory pattern is one of five design patterns in the Creational Design Pattern group. The abstract factory provides an interface for creating families of related or dependent objects without specifying their concrete classes.
Đinh Thành Công Blog

My website, where I write blogs on a variety of topics and where I have some experiments with new technologies.

hotlinelinkedinskypezalofacebook
DMCA.com Protection Status
Góp ý
Họ & Tên
Số điện thoại
Email
Nội dung
Tải ứng dụng
hotline

copyright © 2023 - AGAPIFA

Privacy
Term
About