Clean Code JavaScript – Wie man Code schreibt, den man Kollegen nicht vorzeigt

Kennen Sie das Gefühl, wenn Sie alten Code öffnen und nicht verstehen, was Sie damit meinten? Oder wenn ein Kollege um Hilfe mit seinem Skript bittet und Sie Stunden damit verbringen, es zu entschlüsseln? Das Clean Code JavaScript Repository ist eine Sammlung praktischer Regeln, die Ihnen helfen, Ihren Code verständlich, wartbar und professionell zu gestalten.

Warum ist sauberer Code so wichtig?

In über 15 Jahren Arbeit mit JavaScript habe ich Hunderte von Projekten gesehen. Und das Hauptproblem bei den meisten davon ist nicht algorithmische Komplexität, sondern schlechte Lesbarkeit. Wir verbringen zehnmal mehr Zeit damit, Code zu lesen als ihn zu schreiben. Clean Code JavaScript ist eine Adaption von Robert Martins berühmtem Buch „Clean Code" für die JavaScript-Welt.

Wie der Repository-Autor Ryan McDermott sagt:

„Jeder Code beginnt als Entwurf, wie feuchter Ton, der seine endgültige Form annimmt. Wir bearbeiten Unvollkommenheiten heraus, wenn wir ihn mit Kollegen überprüfen."

5 wichtige Prinzipien aus dem Repository

1. Aussagekräftige Variablennamen

Der erste Schritt zu sauberem Code ist die richtige Benennung. Sie sollten:

• Aussprechbar sein
• Suchbar sein (damit Sie sie per Strg+F finden)
• Keine mentale Übersetzung erfordern

Schlecht:

const yyyymmdstr = moment().format('YYYY/MM/DD');

Gut:

const currentDate = moment().format('YYYY/MM/DD');

2. Funktionen sollten nur eine Sache erledigen

Dieser Fehler tritt in 90 % der Projekte auf. Eine Funktion ist kein Roman, sondern ein kurzes Gedicht.

Schlecht:

function emailClients(clients) {
  clients.forEach(client => {
    const record = database.lookup(client);
    if (record.isActive()) email(client);
  });
}

Gut:

function emailActiveClients(clients) {
  clients.filter(isActiveClient).forEach(email);
}

function isActiveClient(client) {
  const record = database.lookup(client);
  return record.isActive();
}

3. Nebeneffekte vermeiden

Eine Funktion sollte nichts außerhalb ihres Verantwortungsbereichs verändern. Dies ist besonders wichtig bei der Arbeit mit Arrays und Objekten.

Schlecht:

const addItemToCart = (cart, item) => {
  cart.push({ item, date: Date.now() });
};

Gut:

const addItemToCart = (cart, item) => {
  return [...cart, { item, date: Date.now() }];
};

4. SOLID für JavaScript

SOLID-Prinzipien funktionieren nicht nur in Java und C#. So sieht Dependency Inversion in JS aus:

Schlecht:

class InventoryTracker {
  constructor(items) {
    this.items = items;
    this.requester = new InventoryRequester();
  }
}

Gut:

class InventoryTracker {
  constructor(items, requester) {
    this.items = items;
    this.requester = requester;
  }
}

5. Testbarkeit

Sauberer Code ist testbarer Code. Jede Funktion sollte eine einzelne Verantwortung und ein vorhersehbares Ergebnis haben.

Schlecht:

describe('MomentJS', () => {
  it('handles all cases', () => {
    // 20 строк теста разных сценариев
  });
});

Gut:

describe('MomentJS', () => {
  it('handles 30-day months', () => {
    // один четкий сценарий
  });
  
  it('handles leap year', () => {
    // другой сценарий
  });
});

Wer profitiert von diesem Repository?

• Junior-Entwickler: Sie werden den Unterschied zwischen funktionierendem Code und gutem Code verstehen
• Teamleiter: Sie können diese Prinzipien für Code-Reviews verwenden
• Ausbilder: Sie erhalten ausgezeichnete Beispiele für JavaScript-Kurse
• Freiberufler: Kunden schätzen sauberen und wartbaren Code

Persönliche Erfahrung mit der Umsetzung

In meiner Praxis gab es ein Projekt mit 50 Dateien mit jeweils über 500 Zeilen Code. Nach der Umsetzung der Clean Code Prinzipien:

• Die Zeit für neue Features sank um 40 %
• Die Anzahl der Produktionsfehler sank um das Dreifache
• Neue Entwickler wurden doppelt so schnell eingearbeitet

Wie fängt man an?

1. Repository bookmarken
2. Wählen Sie 2–3 Regeln, die Sie am häufigsten verletzen
3. Beginnen Sie, sie in neuem Code anzuwenden
4. Refaktorieren Sie nach und nach alte Abschnitte

Wie der Autor sagt: „Diese Regeln sind kein Dogma, sondern ein Leitfaden. Unser Beruf ist jung, und wir lernen noch."

Links:

• Clean Code JavaScript Repository
• Robert Martins Buch „Clean Code"