Entwurfsmuster in TypeScript mit Beispielen: von A bis Z

Online Python-Trainer für Anfänger

Lernen Sie Python einfach ohne theoretische Überlastung. Lösen Sie praktische Aufgaben mit automatischer Überprüfung und schreiben Sie Code direkt im Browser.

Kurs starten

Entwurfsmuster in TypeScript: vom Einfachen zum Komplexen



Entwurfsmuster (Design Patterns) sind bewährte Lösungen für wiederkehrende Aufgaben in der Softwareentwicklung. Im Kontext von TypeScript, das JavaScript um strenge Typisierung und OOP-Fähigkeiten erweitert, werden Muster besonders effektiv. TypeScript ermöglicht die Implementierung von Abstraktionen, Schnittstellen und Polymorphismus auf einem neuen Niveau und macht den Code vorhersehbarer und sicherer.



In diesem Artikel behandeln wir die wichtigsten Entwurfsmuster, ihre Implementierung in TypeScript und praktische Anwendungsbeispiele. Das Material ist sowohl für Anfänger als auch für erfahrene Entwickler nützlich, die ihr Wissen systematisieren möchten.



Erzeugungsmuster: Singleton und Factory Method



Erzeugungsmuster sind für die Objekterstellung zuständig und verbergen die Instanziierungslogik. Betrachten wir zwei der bekanntesten Vertreter: Singleton und Factory Method.



Singleton (Einzelstück)



Singleton stellt sicher, dass eine Klasse nur eine Instanz hat, und bietet einen globalen Zugriffspunkt darauf. In TypeScript wird die Implementierung durch statische Member und private Konstruktoren besonders elegant.



class DatabaseConnection {    private static instance: DatabaseConnection;    private connectionString: string;

private constructor(connectionString: string) { this.connectionString = connectionString; console.log(`Verbindung erstellt mit: ${connectionString}`); }

static getInstance(connectionString: string): DatabaseConnection { if (!DatabaseConnection.instance) { DatabaseConnection.instance = new DatabaseConnection(connectionString); } return DatabaseConnection.instance; }

query(sql: string): void { console.log(`Ausführen der Abfrage: ${sql} auf ${this.connectionString}`); }}

// Verwendungconst db1 = DatabaseConnection.getInstance('postgres://localhost:5432/mydb');const db2 = DatabaseConnection.getInstance('postgres://localhost:5432/mydb');console.log(db1 === db2); // true - dasselbe Objekt


Dieses Muster eignet sich ideal für die Verwaltung von Ressourcen: Verbindungspools, Logging, Caching. Seien Sie jedoch vorsichtig – Singleton kann das Testen aufgrund des globalen Zustands erschweren.



Factory Method (Fabrikmethode)



Factory Method definiert eine Schnittstelle zur Objekterstellung, ermöglicht es Unterklassen jedoch, den Typ des erstellten Objekts zu ändern. In TypeScript wird dies durch abstrakte Klassen oder Schnittstellen umgesetzt.



interface Notification {    send(message: string): void;}

class EmailNotification implements Notification { send(message: string): void { console.log(`Sende Email: ${message}`); }}

class SMSNotification implements Notification { send(message: string): void { console.log(`Sende SMS: ${message}`); }}

abstract class NotificationFactory { abstract createNotification(): Notification;

notify(message: string): void { const notification = this.createNotification(); notification.send(message); }}

class EmailFactory extends NotificationFactory { createNotification(): Notification { return new EmailNotification(); }}

class SMSFactory extends NotificationFactory { createNotification(): Notification { return new SMSNotification(); }}

// Verwendungconst factory: NotificationFactory = new EmailFactory();factory.notify('Ihre Bestellung wurde bestätigt!');


Factory Method hilft, das Open/Closed-Prinzip (OCP) einzuhalten – Sie können neue Benachrichtigungstypen hinzufügen, ohne vorhandenen Code zu ändern.



Strukturmuster: Adapter und Decorator



Strukturmuster helfen, Beziehungen zwischen Objekten und Klassen zu organisieren und machen das System flexibler und erweiterbarer.



Adapt

Blogs

Buchempfehlungen