Die häufigsten Fehler von JavaScript-Anfängern: von A bis Z

Einleitung: Warum JavaScript ein Minenfeld für Anfänger ist

JavaScript ist eine Sprache, die gleichzeitig einfach zu erlernen und schwer tiefgründig zu verstehen ist. Viele angehende Entwickler stoßen bei Node.js auf unerwartete Bugs, die irrational erscheinen. Das Problem liegt oft nicht in der Logik des Algorithmus, sondern in grundlegenden Spracheigenschaften: Asynchronität, nicht offensichtlichem Verhalten von this und Feinheiten der Gültigkeitsbereiche.

In diesem Artikel analysieren wir die häufigsten Fehler, die Anfänger in JavaScript (am Beispiel von Node.js) machen. Jeder Punkt wird von echtem Code und einer Erklärung begleitet, wie man es behebt. Wenn Sie zuverlässigen Code schreiben und keine Stunden mit Debugging verschwenden möchten, ist dieses Material für Sie.

1. Verwirrung mit dem Gültigkeitsbereich: var, let und const

Eines der häufigsten Probleme ist die Verwendung des veralteten var und das Unverständnis des Unterschieds zwischen let und const.

Problem mit var und Hoisting

Variablen, die mit var deklariert werden, "hoisten" an den Anfang der Funktion, bleiben aber bis zum Zeitpunkt der Initialisierung undefined. Dies führt zu schwer auffindbaren Bugs.

// ❌ Fehler: undefined statt ReferenceErrorconsole.log(myVar); // undefined (kein Fehler!)var myVar = 5;

// ✅ Richtig: let oder constconsole.log(myLet); // ReferenceError: Cannot access 'myLet' before initializationlet myLet = 5;

Closures in Schleifen

Klassischer Fehler mit var in Schleifen:

// ❌ Falsch: alle Callbacks geben 3 ausfor (var i = 0; i < 3; i++) {    setTimeout(() => console.log(i), 100);}// Ausgabe: 3, 3, 3

// ✅ Korrektur: let erstellt eine neue Bindung für jede Iterationfor (let i = 0; i < 3; i++) {    setTimeout(() => console.log(i), 100);}// Ausgabe: 0, 1, 2

Tipp: Vergessen Sie var im modernen JavaScript. Verwenden Sie standardmäßig const und let, wenn die Variable neu zugewiesen werden soll.

2. Asynchronitäts-Chaos: Callback Hell und falscher Umgang mit Promises

Node.js basiert auf Asynchronität. Anfänger versuchen oft, das Ergebnis einer asynchronen Funktion synchron zu erhalten, was zu undefined führt.

Ignorieren von Promises

// ❌ Fehler: Funktion gibt undefined zurückfunction getUserData(userId) {    const user = database.findUser(userId); // Asynchrone Operation    return user; // undefined, da die Daten noch nicht angekommen sind}

// ✅ Richtig: Promise zurückgebenasync function getUserData(userId) {    const user = await database.findUser(userId);    return user;}

Callback Hell

Verschachtelte Callbacks machen den Code unlesbar und schwer wartbar:

// ❌ Schlecht: Callback-Pyramidefs.readFile('a.txt', (err, dataA) => {    fs.readFile('b.txt', (err, dataB) => {        fs.writeFile('c.txt', dataA + dataB, (err) => {            console.log('Fertig!');        });    });});

// ✅ Gut: async/awaitasync function mergeFiles() {    const dataA = await fs.promises.readFile('a.txt');    const dataB = await fs.promises.readFile('b.txt');    await fs.promises.writeFile('c.txt', dataA + dataB);    console.log('Fertig!');}

Goldene Regel: Wenn Sie eine Verschachtelung tiefer als 2 Ebenen sehen, refaktorieren Sie mit async/await.

3. Das rätselhafte this: Kontextverlust

In JavaScript wird this dadurch bestimmt, wie eine Funktion aufgerufen wird, nicht wo sie deklariert ist. Dies ist der Hauptgrund für Verwirrung.

Verlust von this in Objektmethoden

const user = {    name: 'Alex',    greet() {        console.log(`Hallo, ${this.name}`);    }};

// ✅ Funktioniertuser.greet(); // Hallo, Alex

// ❌ Fehler: this verloren