HOWTO · JavaScript
Erstes Element des Arrays in JavaScript abrufen
In diesem Artikel erfahren Sie, wie Sie das erste Element eines Arrays in JavaScript abrufen.
Auf dieser Seite
JavaScript-Arrays verwenden nullbasierte Indizes. Mit array[0] lesen Sie das erste Element, ohne das Array zu verändern. Wenn Sie das erste Element suchen, das eine Bedingung erfüllt, verwenden Sie find(); rufen Sie shift() nur auf, wenn Sie das erste Element zugleich entfernen möchten.
Das erste Array-Element mit array[0] in JavaScript abrufen
Die erste Position eines Arrays hat den Index 0, die zweite den Index 1 und so weiter. Dieses eigenständige Beispiel liest das erste Element und gibt anschließend das Array aus, damit Sie sehen, dass das ursprüngliche Array unverändert bleibt.
const fruits = ["apple", "banana", "cherry"];
const firstFruit = fruits[0];
console.log(firstFruit);
console.log(fruits);
Das Beispiel gibt Folgendes aus; die Beschriftungen in der unveränderten Ausgabe bleiben auf Englisch:
apple
[ 'apple', 'banana', 'cherry' ]
Ist das Array leer, ergibt array[0] den Wert undefined. Prüfen Sie daher, ob ein Element vorhanden ist, wenn Ihr Code einen Wert benötigt. Für eine Suche nach einer bestimmten Bedingung können Sie die Array-Methode find() verwenden, statt jedes Element selbst zu prüfen.
Das erste Array-Element mit Destrukturierung in JavaScript abrufen
Mit Array-Destrukturierung weisen Sie das erste Element einer Variablen zu. Zum Beispiel liest const [firstFruit] = fruits; denselben Wert wie fruits[0] und lässt fruits unverändert. Ist das Array leer, hat firstFruit den Wert undefined. Verwenden Sie diese Schreibweise, wenn die Zuweisung eines oder mehrerer Anfangselemente an Variablen den umgebenden Code übersichtlicher macht.
Mit find() das erste passende Array-Element in JavaScript abrufen
Verwenden Sie find(), wenn eine Prüfbedingung festlegt, welches Element Sie suchen. Die Methode prüft die Elemente der Reihe nach und gibt das erste zurück, für das die Bedingung einen truthy-Wert liefert. Gibt es kein passendes Element, lautet das Ergebnis undefined; berücksichtigen Sie diesen Fall, bevor Sie das Ergebnis verwenden.
Zum Beispiel wählt const firstLongWord = words.find(word => word.length > 5); das erste Wort aus, das länger als fünf Zeichen ist. Wenn Sie unabhängig vom Wert einfach das erste Element möchten, ist array[0] die einfachere Wahl. Weitere Einzelheiten finden Sie in der JavaScript-Array-find-Referenz. Diese Referenz ist auf Englisch, da keine deutsche Version verfügbar ist.
Mit shift() das erste Array-Element in JavaScript abrufen und entfernen
Rufen Sie shift() ohne Argumente auf, um das erste Element abzurufen und zu entfernen. Die Methode gibt den entfernten Wert zurück und verändert das ursprüngliche Array. Ist das Array leer, gibt sie undefined zurück. Verwenden Sie diese Methode nur, wenn die Änderung beabsichtigt ist; mit array[0] oder Destrukturierung lesen Sie das erste Element, ohne das Array zu verändern.
Warum filter() meist nicht die beste Wahl ist, um das erste passende Element abzurufen
filter() gibt ein neues Array mit allen Elementen zurück, für die die Prüfbedingung erfüllt ist. Die Methode durchläuft das Array weiter, um sämtliche Treffer zu sammeln. Das bedeutet mehr Arbeit und ein zusätzliches Array, obwohl Sie nur ein Ergebnis benötigen. Für den ersten Treffer ist find() klarer: Die Methode gibt das Element direkt zurück und hält an, sobald sie es gefunden hat.
Sie können mit matches[0] das erste Element einer gefilterten Kopie lesen, aber für einen einzelnen Treffer ist diese Kopie unnötig. Wenn Sie shift() auf dieser Kopie aufrufen, wird ein Element aus der Kopie entfernt, nicht aus dem ursprünglichen Array. Verwenden Sie filter(), wenn Sie tatsächlich alle passenden Elemente benötigen.