JavaScript: Was Senioren im Code suchen und wofür sie Minuspunkte vergeben

Code-Review in JavaScript: Was Senioren wirklich nervt

Jeder Entwickler hat schon einmal einen Pull-Request mit einem Kommentar wie „das solltest du besser umschreiben“ oder „das ist ein Antipattern“ erhalten. Wenn Sie Junior oder Middle sind, wirken solche Anmerkungen oft wie Krittelei. Aber hinter jedem Wort eines Seniors steckt echte Erfahrung: ein Fehler in der Produktion, ein Bug um drei Uhr morgens oder ein Leistungseinbruch.

Wir haben die häufigsten Anmerkungen gesammelt, die Senioren bei Code-Reviews in JavaScript hinterlassen. Dies ist nicht nur eine Liste von „so ist es schlecht, so ist es gut“. Es ist eine Analyse, warum ein bestimmter Ansatz als schlecht gilt und wodurch er ersetzt werden kann.

Der Artikel ist nützlich für alle, die JS schreiben: von Anfängern bis zu erfahrenen Entwicklern, die die Codequalität verbessern möchten.

1. Mutation von Eingabedaten: Die Hauptsünde

Einer der häufigsten Fehler im Review ist das Verändern von übergebenen Objekten oder Arrays in Funktionen. Senioren hassen das, weil Mutation die Unveränderlichkeit bricht und zu schwer auffindbaren Bugs führt.

Schlechtes Beispiel

function addUser(users, newUser) {\n  users.push(newUser); // Mutation des ursprünglichen Arrays!\n  return users;\n}\n\nconst allUsers = [{ id: 1 }, { id: 2 }];\nconst updated = addUser(allUsers, { id: 3 });\nconsole.log(allUsers.length); // 3 — das ursprüngliche Array wurde verändert!

So sollte es sein

function addUser(users, newUser) {\n  return [...users, newUser]; // wir geben ein neues Array zurück\n}\n\nconst allUsers = [{ id: 1 }, { id: 2 }];\nconst updated = addUser(allUsers, { id: 3 });\nconsole.log(allUsers.length); // 2 — das Original bleibt unberührt

Warum das wichtig ist: Wenn Sie Eingabedaten mutieren, erhält jeder andere Code, der auf dasselbe Objekt verweist, unerwartete Änderungen. Das ist der direkte Weg zu Bugs in asynchronen Operationen, Redux-Stores und React-Zuständen.

2. Magische Zahlen und Zeichenketten: Lesbarkeitskiller

Senioren schreiben oft in Kommentaren: „Was ist die Zahl 86400?“ oder „Woher kommt diese Zeichenkette?“. Magische Werte machen den Code unverständlich und erschweren die Wartung.

Schlechtes Beispiel

function calculateDiscount(price) {\n  if (price > 1000) {\n    return price * 0.9;\n  }\n  return price * 0.95;\n}

So sollte es sein

const DISCOUNT_THRESHOLD = 1000;\nconst HIGH_DISCOUNT_RATE = 0.9;\nconst STANDARD_DISCOUNT_RATE = 0.95;\n\nfunction calculateDiscount(price) {\n  if (price > DISCOUNT_THRESHOLD) {\n    return price * HIGH_DISCOUNT_RATE;\n  }\n  return price * STANDARD_DISCOUNT_RATE;\n}

Tipp: Lagern Sie alle Konstanten in benannte Variablen oder eine separate Konfigurationsdatei aus. Das vereinfacht das Code-Review in JavaScript und macht es selbstdokumentierend.

3. Fehler mit async/await und Promises

Asynchroner Code ist ein Bereich, in dem selbst Mittlere stolpern. Senioren achten im Review auf zwei Hauptpunkte: falsche Fehlerbehandlung und Vermischung von Syntaxen.

Schlechtes Beispiel (Promise ohne catch)

async function loadData() {\n  const response = await fetch('/api/data');\n  const data = await response.json();\n  return data;\n}

So sollte es sein

async function loadData() {\n  try {\n    const response = await fetch('/api/data');\n    if (!response.ok) {\n      throw new Error(`HTTP error! status: ${response.status}`);\n    }\n    const data = await response.json();\n    return data;\n  } catch (error) {\n    console.error('Fehler beim Laden der Daten:', error);\n    throw error; // bei Bedarf weiterwerfen\n  }\n}

Wichtig: Ignorieren Sie niemals Fehler. Ein leerer catch ist böse. Wenn ein Fehler auftritt, sollten Sie ihn zumindest protokollieren, besser noch korrekt behandeln.

Ein weiterer häufiger Fehler – vergessenes await

function processUsers(users) {\n  users.forEach(async (user) => {\n    await updateUser(user);