Arrays durchlaufen

Schleifen und Arrays gehören zusammen. Mit einer for-Schleife kannst du die Indizes eines Arrays von 0 bis zum letzten durchgehen und jedes Element lesen:

const spiele = ["Fußball", "Tennis", "Golf"];
for (let i = 0; i < spiele.length; i++) {
    console.log(spiele[i]);
}

Das gibt Folgendes aus:

Fußball
Tennis
Golf

Der Zähler i beginnt bei 0, dem ersten Index. Die Bedingung i < spiele.length beendet die Schleife nach dem letzten Index, der spiele.length - 1 ist. Ein häufiger Fehler ist i <= spiele.length: Die Schleife läuft dann einmal mehr, liest spiele[3], das es nicht gibt, und gibt undefined aus. Dank .length funktioniert die Schleife bei einem Array jeder Länge, auch wenn du später mit .push() weitere Elemente hineinlegst.

Alle Elemente durchzugehen ist so häufig, dass JavaScript dafür eine einfachere Schleife hat, for...of:

const spiele = ["Fußball", "Tennis", "Golf"];
for (const spiel of spiele) {
    console.log(spiel);
}

Fußball
Tennis
Golf

Lies sie als „für jedes spiel aus spiele“. In jedem Durchlauf enthält die Variable spiel das nächste Element: zuerst "Fußball", dann "Tennis" und dann "Golf". Du brauchst gar keinen Index und kein .length. Benenne die Variable nach einem einzelnen Element des Arrays: spiel aus spiele, name aus namen.

Warum kann spiel eine const sein, wenn der Zähler einer klassischen for-Schleife ein let sein muss? Weil for...of für jeden Durchlauf eine neue Variable spiel erstellt, die in diesem Durchlauf nichts mehr ändert. Der Zähler i ist eine einzelne Variable, die i++ immer wieder ändert.

Welche solltest du also verwenden? for...of, wenn du jedes Element nacheinander willst. Sie ist kürzer, und du kannst die Indizes nicht falsch machen. Die klassische for-Schleife, wenn du auch den Index brauchst, zum Beispiel um die Elemente zu nummerieren, oder wenn du rückwärts gehen oder manche überspringen willst.