Über Arrays
In JavaScript ist ein Array eine listenartige Struktur ohne feste Länge, die jeden Typ von primitiven Werten oder Objekten aufnehmen kann, auch gemischte Typen.
Es enthält die Eigenschaft length und außerdem viele nützliche Methoden, um das Array zu durchlaufen und zu verändern.
Um ein Array zu erstellen, schreibst du die Elemente zwischen eckige Klammern [].
Um aus dem Array zu lesen, setzt du den Index in eckige Klammern [] hinter den Bezeichner. Die Indizes eines Arrays beginnen bei null.
Zum Beispiel:
const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names[1];
// => Laura
Arrays lassen sich auch mit der Konstruktor-Syntax erstellen, aber für die meisten Fälle empfiehlt sich die Array-Literal-Syntax.
const names = new Array();
names.push('Jack', 'Laura', 'Paul', 'Megan');
names[1];
// => Laura
Arrays können strings nicht als Elementindizes verwenden, sondern müssen Ganzzahlen (number) verwenden.
Wenn du über Nicht-Ganzzahlen mit der Klammer-Notation (oder Punkt-Notation) etwas setzt oder darauf zugreifst, wird damit kein Element aus der Elementliste des Arrays selbst gesetzt oder abgerufen, sondern eine Variable, die mit der Objekt-Eigenschaftssammlung dieses Arrays verbunden ist.
Die Objekt-Eigenschaften eines Arrays und seine Liste von Array-Elementen sind getrennt, und die Operationen zum Durchlaufen und Verändern des Arrays lassen sich nicht auf diese benannten Eigenschaften anwenden.
const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.length;
// => 4
// Properties can be set on arrays using bracket ['property'] or
// dot .property notation, and this will affect the length, as
// shown below.
names.magician = 'Elyse';
names.length;
// => 4
// The property shows up when logging the array, making it seem
// that the property is somehow incorporated in the array.
names;
// => ["Jack", "Laura", "Paul", "Megan", magician: "Elyse"]
// However, be aware. Properties added via non-numeric keys are
// NOT part of the array's internal list, and are not traversed
// or mutated when using one of the traversal or mutation
// operations.
names.forEach((name) => console.log(name));
// => Jack
// => Laura
// => Paul
// => Megan
Elemente aus einem Array löschen
Arrays sind in JavaScript gewöhnliche objects, und Elemente lassen sich mit dem Schlüsselwort delete löschen.
Das ändert jedoch nicht die Länge des Arrays und hinterlässt ein Loch mit dem Wert empty.
In anderen Sprachen ähnelt das einem dünn besetzten Array.
Die empty-Löcher werden bei Operationen zum Durchlaufen oder Verändern übersprungen.
const names = ['Jack', 'Laura', 'Paul', 'Megan'];
delete names[1];
names;
// => ["Jack", empty, "Paul", "Megan"]
names.length;
// => 4
names.forEach((name) => console.log(name));
// => Jack
// => Paul
// => Megan
Wenn es keine Löcher geben soll und wenn die length die Anzahl der Elemente widerspiegeln soll, die durchlaufen oder verändert werden, dann verwende stattdessen splice.
Die Methode splice() ändert den Inhalt eines Arrays, indem sie vorhandene Elemente entfernt oder ersetzt und/oder an Ort und Stelle neue Elemente hinzufügt.
Zum Beispiel:
const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.splice(1, 1);
names;
// => ["Jack", "Paul", "Megan"]
names.length;
// => 3
names.forEach((name) => console.log(name));
// => Jack
// => Paul
// => Megan
Die Länge eines Arrays lässt sich verändern
Die Eigenschaft length eines Arrays ist mit der Liste der Elemente verbunden, die das Array enthält.
Sie lässt sich verändern.
Wenn die Länge erhöht wird, entstehen empty-Löcher, die beim Durchlaufen oder Verändern des Arrays nicht berücksichtigt werden.
Wenn die Länge verringert wird, entfernt sie die Elemente am Ende des Arrays.
const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.length = 6;
names;
// => ["Jack", "Laura", "Paul", "Megan", empty × 2]
names.length = 2;
// => ["Jack", "Laura"]
Prüfen, ob etwas ein Array ist
Weil Arrays objects sind, liefert typeof names den Wert "object".
Um zu prüfen, ob etwas ein Array ist, verwendest du Array.isArray:
const names = ['Jack', 'Laura', 'Paul', 'Megan'];
typeof names;
// => "object"
Array.isArray(names);
// => true
const object = {};
Array.isArray(object);
// => false
Vielleicht bist du versucht, names instanceof Array zu verwenden. Das kann funktionieren, aber nicht unter allen Umständen.
Lies diesen Artikel für weitere Informationen.
Array-Methoden
Einige der Methoden, die für jedes Array-Objekt verfügbar sind, kannst du verwenden, um Elemente zum Array hinzuzufügen oder daraus zu entfernen.
Hier sind ein paar davon:
push
Die Methode push() fügt ein oder mehrere Elemente am Ende eines Arrays hinzu und gibt die neue Länge des Arrays zurück.
const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.push('Jill'); // => 5
names;
// => ['Jack', 'Laura', 'Paul', 'Megan', 'Jill']
pop
Die Methode pop() entfernt das letzte Element aus einem Array und gibt dieses Element zurück.
Diese Methode ändert die Länge des Arrays.
const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.pop(); // => 'Megan'
names;
// => ['Jack', 'Laura', 'Paul']
shift
Die Methode shift() entfernt das erste Element aus einem Array und gibt dieses entfernte Element zurück.
Diese Methode ändert die Länge des Arrays.
const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.shift(); // => 'Jack'
names;
// => ['Laura', 'Paul', 'Megan']
unshift
Die Methode unshift() fügt ein oder mehrere Elemente am Anfang eines Arrays hinzu und gibt die neue Länge des Arrays zurück.
const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.unshift('Jill'); // => 5
names;
// => ['Jill', 'Jack', 'Laura', 'Paul', 'Megan']
splice
Die Methode splice() ändert den Inhalt eines Arrays, indem sie vorhandene Elemente entfernt oder ersetzt und/oder an Ort und Stelle neue Elemente hinzufügt.
Diese Methode gibt ein Array zurück, das die gelöschten Elemente enthält.
const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.splice(2, 1, 'Jill'); // => ['Paul']
names;
// => ['Jack', 'Laura', 'Jill', 'Megan']
49 Übungen
Lerne Arrays