Clean Code auf TypeScript: Prinzipien und Beispiele für Anfänger

Clean Code auf TypeScript: Prinzipien und Beispiele für Anfänger

Sauberer Code (Clean Code) ist nicht nur ein modischer Begriff, sondern eine Entwicklungsphilosophie, die hilft, Programme zu schreiben, die für andere Entwickler (und für Sie selbst in einem halben Jahr) verständlich sind. Für Anfänger im Programmieren mit TypeScript ist das Erlernen der Prinzipien von sauberem Code ein entscheidender Schritt zum beruflichen Wachstum. In diesem Artikel analysieren wir die grundlegenden Regeln, geben anschauliche Beispiele und zeigen, wie Sie Ihren TypeScript-Code elegant und wartbar gestalten.

Warum ist sauberer Code wichtig?

Stellen Sie sich vor, Sie lesen ein Buch ohne Absätze, Satzzeichen und alle Wörter sind zusammengeschrieben. Ungefähr so sieht schmutziger Code für einen anderen Entwickler aus. Sauberer Code spart Zeit beim Debuggen, vereinfacht das Hinzufügen neuer Funktionen und reduziert die Anzahl der Fehler. TypeScript mit seiner strengen Typisierung hilft bereits, zuverlässigeren Code zu schreiben, aber ohne die Einhaltung der Prinzipien der Sauberkeit kann selbst typisierter Code unlesbar werden.

// Schlecht: unlesbarfunction d(a:any,b:any){if(a>b){return a}else{return b}}

// Gut: sauber und verständlichfunction findMaxValue(firstNumber: number, secondNumber: number): number {    if (firstNumber > secondNumber) {        return firstNumber;    }    return secondNumber;}

Grundlegende Prinzipien von Clean Code in TypeScript

1. Aussagekräftige Namen für Variablen und Funktionen

Der Name sollte die Fragen "was?" und "warum?" beantworten. Vermeiden Sie einbuchstabige Abkürzungen (außer bei Schleifenindizes) und abstrakte Bezeichnungen. Verwenden Sie camelCase für Variablen und PascalCase für Klassen.

// Schlechtconst d = new Date();const arr = [1, 2, 3];function p(x: number) { return x * 2; }

// Gutconst currentDate = new Date();const numbersList: number[] = [1, 2, 3];function doubleValue(value: number): number {    return value * 2;}

2. Funktionen sollten nur eine Sache tun

Jede Funktion sollte eine einzige Aufgabe lösen. Wenn eine Funktion mehr als eine Aktion ausführt, teilen Sie sie in mehrere kleine auf. Das verbessert die Lesbarkeit und Testbarkeit.

// Schlecht: Die Funktion macht alles auf einmalfunction processUserData(userData: string): void {    const parsed = JSON.parse(userData);    const isValid = parsed.name && parsed.email;    if (isValid) {        console.log(`User ${parsed.name} registered`);        saveToDatabase(parsed);    }}

// Gut: Jede Funktion ist für ihren eigenen Bereich zuständigfunction parseUserData(rawData: string): User {    return JSON.parse(rawData);}

function validateUserData(user: User): boolean {    return !!user.name && !!user.email;}

function registerUser(userData: string): void {    const user = parseUserData(userData);    if (validateUserData(user)) {        console.log(`User ${user.name} registered`);        saveToDatabase(user);    }}

3. Vermeiden Sie magische Zahlen und Zeichenketten

Magische Zahlen sind Literale, deren Bedeutung ohne Kontext unklar ist. Lagern Sie sie in Konstanten mit verständlichen Namen aus.

// Schlechtif (user.age > 18) {    // ...}const discount = price * 0.1;

// Gutconst ADULT_AGE = 18;const STANDARD_DISCOUNT_RATE = 0.1;

if (user.age > ADULT_AGE) {    // ...}const discount = price * STANDARD_DISCOUNT_RATE;

4. Verwenden Sie Typen und Schnittstellen richtig

TypeScript bietet leistungsstarke Werkzeuge zur Beschreibung von Daten. Verwenden Sie any nicht übermäßig, bevorzugen Sie konkrete Typen. Erstellen Sie Schnittstellen für komplexe Objekte.

// Schlechtfunction createUser(name: any, age: any) {    return { name, age, createdAt: new Date() };}

// Gutinterface User {    name: string;    age: number;    createdAt: Date;}

function createUser(name: string, age: number): User {    return {        name,        age,        createdAt: new Date()    };}