Explore the Factory Method Pattern in TypeScript, a creational design pattern that provides an interface for creating objects, allowing subclasses to alter the type of objects that will be created. Learn how to implement this pattern to achieve flexibility and maintainability in your TypeScript applications.
The Factory Method Pattern is a creational design pattern that provides an interface for creating objects in a superclass, but allows subclasses to alter the type of objects that will be created. This pattern is particularly useful when a class cannot anticipate the class of objects it must create or when a class wants its subclasses to specify the objects it creates.
The primary intent of the Factory Method Pattern is to define an interface for creating an object, but let subclasses decide which class to instantiate. This pattern lets a class defer instantiation to subclasses, promoting flexibility and scalability in object-oriented design.
In many scenarios, applications require flexibility in object creation. Hardcoding the instantiation of specific classes can lead to a rigid design that is difficult to extend or maintain. The Factory Method Pattern addresses this by allowing the creation logic to be encapsulated in a method, which can be overridden by subclasses to create specific types of objects. This approach adheres to the Open/Closed Principle, allowing the system to be open for extension but closed for modification.
The Factory Method Pattern involves several key participants:
To better understand the relationships between these participants, let’s visualize them using a UML class diagram:
classDiagram
class Product {
<<interface>>
}
class ConcreteProductA {
+operation()
}
class ConcreteProductB {
+operation()
}
class Creator {
+factoryMethod() Product
+someOperation()
}
class ConcreteCreatorA {
+factoryMethod() ConcreteProductA
}
class ConcreteCreatorB {
+factoryMethod() ConcreteProductB
}
Product <|-- ConcreteProductA
Product <|-- ConcreteProductB
Creator <|-- ConcreteCreatorA
Creator <|-- ConcreteCreatorB
Creator o-- Product
The Factory Method Pattern promotes loose coupling by separating the code that creates objects from the code that uses them. This separation allows for flexibility in changing the types of objects created without affecting the client code. By adhering to the Open/Closed Principle, the pattern ensures that new product types can be introduced without modifying existing code, thus enhancing maintainability and scalability.
Let’s explore how to implement the Factory Method Pattern in TypeScript with a practical example. We’ll create a simple application that generates different types of documents.
First, we define the Document interface, which represents the Product in our pattern.
1// Document.ts
2export interface Document {
3 print(): void;
4}
Next, we implement two ConcreteProducts: PDFDocument and WordDocument.
1// PDFDocument.ts
2import { Document } from './Document';
3
4export class PDFDocument implements Document {
5 print(): void {
6 console.log('Printing PDF document...');
7 }
8}
9
10// WordDocument.ts
11import { Document } from './Document';
12
13export class WordDocument implements Document {
14 print(): void {
15 console.log('Printing Word document...');
16 }
17}
Now, we define the DocumentCreator abstract class, which declares the factory method.
1// DocumentCreator.ts
2import { Document } from './Document';
3
4export abstract class DocumentCreator {
5 abstract createDocument(): Document;
6
7 someOperation(): void {
8 const document = this.createDocument();
9 document.print();
10 }
11}
Finally, we implement the ConcreteCreators: PDFDocumentCreator and WordDocumentCreator.
1// PDFDocumentCreator.ts
2import { DocumentCreator } from './DocumentCreator';
3import { PDFDocument } from './PDFDocument';
4
5export class PDFDocumentCreator extends DocumentCreator {
6 createDocument(): PDFDocument {
7 return new PDFDocument();
8 }
9}
10
11// WordDocumentCreator.ts
12import { DocumentCreator } from './DocumentCreator';
13import { WordDocument } from './WordDocument';
14
15export class WordDocumentCreator extends DocumentCreator {
16 createDocument(): WordDocument {
17 return new WordDocument();
18 }
19}
Now, let’s see how we can use these classes in our application.
1// Main.ts
2import { PDFDocumentCreator } from './PDFDocumentCreator';
3import { WordDocumentCreator } from './WordDocumentCreator';
4
5function main() {
6 const pdfCreator = new PDFDocumentCreator();
7 pdfCreator.someOperation(); // Output: Printing PDF document...
8
9 const wordCreator = new WordDocumentCreator();
10 wordCreator.someOperation(); // Output: Printing Word document...
11}
12
13main();
Experiment with the code by adding a new document type, such as ExcelDocument, and a corresponding ExcelDocumentCreator. Observe how the Factory Method Pattern allows you to extend the system without modifying existing code.
To further illustrate how the Factory Method Pattern works, let’s visualize the process flow using a sequence diagram:
sequenceDiagram
participant Client
participant Creator
participant ConcreteCreator
participant Product
Client->>ConcreteCreator: createDocument()
ConcreteCreator->>Product: new ConcreteProduct()
ConcreteCreator-->>Client: ConcreteProduct
Client->>Product: print()
The Factory Method Pattern is a powerful tool in the software engineer’s toolkit, providing a flexible and scalable approach to object creation. By understanding and implementing this pattern, you can enhance the maintainability and scalability of your TypeScript applications.
For more information on the Factory Method Pattern, consider exploring the following resources:
Remember, this is just the beginning. As you progress, you’ll build more complex and interactive applications. Keep experimenting, stay curious, and enjoy the journey!