Clean Code in TypeScript: Prinzipien und Beispiele für Praktiker

Clean Code in TypeScript: Prinzipien und Beispiele in der Praxis

Sauberer Code (Clean Code) ist nicht nur ein modischer Begriff, sondern eine grundlegende Fähigkeit eines professionellen Entwicklers. Im Kontext von TypeScript, das dem dynamischen JavaScript eine statische Typisierung hinzufügt, werden die Prinzipien des sauberen Codes noch wichtiger. TypeScript gibt uns mächtige Werkzeuge zur Selbst-Dokumentation des Codes, aber ohne den richtigen Ansatz können sie im Chaos enden.

In diesem Artikel werden wir die wichtigsten Clean-Code-Prinzipien in Bezug auf TypeScript analysieren und praktische Beispiele betrachten, die Ihnen helfen, lesbareren, wartbareren und zuverlässigeren Code zu schreiben.

1. Namensgebung: Sprechen Sie die Sprache des Geschäfts

Das erste und offensichtlichste Prinzip von Clean Code ist die korrekte Namensgebung. Namen von Variablen, Funktionen, Klassen und Schnittstellen sollten ihr Wesen und die Absicht des Entwicklers widerspiegeln. TypeScript mit seiner strengen Typisierung ermöglicht es, Namen noch aussagekräftiger zu gestalten.

Schlechtes Beispiel:

// Was macht diese Funktion? Wie lange dauert es, das zu verstehen?function d(a: number, b: number): number {    return a * b - (a + b);}

// Und was ist das für ein Interface?interface I {    n: string;    a: number;    e: string;}

Gutes Beispiel:

// Funktion zur Berechnung des Rabatts unter Berücksichtigung der Schwellefunction calculateDiscountedPrice(price: number, discountPercent: number): number {    const discountAmount = price * (discountPercent / 100);    return price - discountAmount;}

// Benutzerprofil-Interface mit expliziten Felderninterface UserProfile {    name: string;    age: number;    email: string;}

Regeln für TypeScript:

• Interfaces — verwenden Sie Substantive ohne das Präfix I (z.B. User, nicht IUser). Modernes TypeScript und ESLint empfehlen genau diesen Ansatz.
• Typen — für komplexe Vereinigungen verwenden Sie die Union | und aussagekräftige Namen: StatusType, ApiResponse.
• Boolesche Variablen — beginnen Sie mit is, has, should: isActive, hasPermission.
• Funktionen — verwenden Sie Verben: getUserData, validateEmail, processOrder.

2. SOLID in TypeScript: Praktische Anwendung

Die SOLID-Prinzipien (Single Responsibility, Open-Closed, Liskov Substitution, Interface Segregation, Dependency Inversion) lassen sich dank der Unterstützung von Interfaces, abstrakten Klassen und Generics hervorragend auf TypeScript anwenden.

Prinzip der einzigen Verantwortung (SRP): Eine Klasse sollte nur einen Grund für eine Änderung haben.

// Verletzung des SRP: Die Klasse macht zu vielclass UserService {    createUser(data: any) { /* ... */ }    sendEmail(email: string) { /* ... */ }    generateReport() { /* ... */ }}

// Richtiger Ansatz: Aufteilung der Verantwortlichkeitenclass UserRepository {    save(user: User): void { /* ... */ }}

class EmailService {    sendWelcomeEmail(email: string): void { /* ... */ }}

class ReportGenerator {    generateUserReport(users: User[]): Report { /* ... */ }}

Liskovsches Substitutionsprinzip (LSP): Unterklassen sollten mit der Basisklasse austauschbar sein. In TypeScript ist dies besonders bei der Arbeit mit Vererbung relevant.

// Verletzung des LSP: Die Unterklasse schränkt den Vertrag einclass Bird {    fly(): void { console.log('Flying'); }}

class Penguin extends Bird {    fly(): void {        throw new Error('Penguins cannot fly!');    }}

// Richtig: Interface auslagerninterface Flyable {    fly(): void;}

class Bird implements Flyable {    fly(): void { console.log('Flying'); }}

class Penguin {    s