JavaScript-Arrays

Einführung in JavaScript-Arrays

JavaScript-Arrays sind vielseitige, geordnete Sammlungen, die eine Vielzahl von Elementen speichern können, darunter Zahlen, Strings und Objekte. Sie bieten eine flexible Möglichkeit, Daten in Ihren Anwendungen zu gruppieren und zu verwalten.

Arrays erstellen und initialisieren

Es gibt mehrere Möglichkeiten, Arrays in JavaScript zu erstellen. Die gebräuchlichste Methode ist die Verwendung der Array-Literal-Syntax:

---

let fruits = ["Apple", "Banana", "Cherry"];

Alternativ können Sie ein Array mit dem Konstruktor new Array() initialisieren, obwohl dies weniger üblich ist:

---

let fruits = new Array("Apple", "Banana", "Cherry");

Array-Methoden und -Eigenschaften

JavaScript-Arrays verfügen über eine Reihe integrierter Methoden und Eigenschaften, die die Bearbeitung der Daten erleichtern.

INFO

Weitere integrierte Funktionen finden Sie unter JavaScript Array Methods

Elemente hinzufügen und entfernen

• push(): Fügt ein oder mehrere Elemente am Ende eines Arrays hinzu und gibt die neue Länge zurück.

---

Output appears here after Run.

• pop(): Entfernt das letzte Element aus einem Array und gibt dieses Element zurück.

---

Output appears here after Run.

• unshift(): Fügt ein oder mehrere Elemente am Anfang eines Arrays hinzu und gibt die neue Länge zurück.

---

Output appears here after Run.

• shift(): Entfernt das erste Element aus einem Array und gibt dieses Element zurück.

---

Output appears here after Run.

Auf Elemente zugreifen und über sie iterieren

• length: Diese Eigenschaft gibt die Anzahl der Elemente in einem Array zurück.
• forEach(): Diese Methode führt eine bereitgestellte Funktion einmal für jedes Array-Element aus.

---

Output appears here after Run.

• map(): Erstellt ein neues Array mit den Ergebnissen des Aufrufs einer bereitgestellten Funktion für jedes Element des aufrufenden Arrays.

---

Output appears here after Run.

Erweiterte Array-Operationen

Mehrdimensionale Arrays

JavaScript-Arrays können andere Arrays speichern und ermöglichen so die Erstellung mehrdimensionaler Arrays.

---

Output appears here after Run.

Spread-Operator und Destrukturierung

Spread-Operator

Der Spread-Operator (...) in JavaScript ermöglicht es, ein iterierbares Objekt (wie ein Array oder einen String) an Stellen zu erweitern, an denen mehrere Elemente oder Argumente erwartet werden. Er ist unglaublich vielseitig für Array-Manipulationen.

• Arrays kombinieren:

---

Output appears here after Run.

• Arrays kopieren:

---

Output appears here after Run.

• Mit Funktionen verwenden:

---

Output appears here after Run.

Destrukturierung

Die Destrukturierung in JavaScript ermöglicht es Ihnen, Werte aus Arrays oder Eigenschaften aus Objekten in einzelne Variablen zu entpacken.

• Array-Destrukturierung:

---

Output appears here after Run.

• Variablen tauschen:

---

let a = 1, b = 2;
[a, b] = [b, a];   // a becomes 2, b becomes 1
console.log(a, b);

• Standardwerte:

---

Output appears here after Run.

Sowohl der Spread-Operator als auch die Destrukturierung verbessern die Lesbarkeit und Effizienz von JavaScript-Code und ermöglichen prägnantere und ausdrucksstärkere Programmiermuster.

Callback-Methoden für Arrays

Methoden wie filter, reduce und some bieten leistungsstarke Möglichkeiten, Daten in Arrays zu verarbeiten und auszuwerten. Diese Methoden nehmen eine Callback-Funktion als Argument und können eine Vielzahl komplexer Operationen ausführen.

• filter(): Erstellt ein neues Array mit allen Elementen, die den von der bereitgestellten Funktion implementierten Test bestehen.

---

Output appears here after Run.

Sortieren und Suchen in Arrays

• sort(): Sortiert die Elemente eines Arrays direkt und gibt das sortierte Array zurück.

WARNING

Standardmäßig wandelt sort() Elemente in Strings um und sortiert sie lexikografisch. Bei Zahlen kann dies zu unerwarteten Ergebnissen führen (z. B. kommt 10 vor 2). Geben Sie für die numerische Sortierung immer eine Vergleichsfunktion an.

---

Output appears here after Run.

• find() and findIndex(): Werden verwendet, um nach einem Element im Array zu suchen.

---

Output appears here after Run.

Arrays in Strings umwandeln

Die Methode join() kombiniert alle Elemente eines Arrays zu einem einzigen String.

---

Output appears here after Run.

Best Practices für die Verwendung von Arrays in JavaScript

• Verwenden Sie const für die Deklaration von Arrays, die nicht neu zugewiesen werden.

Die Verwendung von const für die Array-Deklaration ist eine gute Praxis. Sie verhindert die erneute Zuweisung des Array-Bezeichners und stellt sicher, dass die Referenz auf das Array konstant bleibt. Der Inhalt des Arrays kann jedoch weiterhin geändert werden.

---

Output appears here after Run.

Dadurch wird sichergestellt, dass sich fruits immer auf dasselbe Array bezieht, bedeutet aber nicht, dass das Array selbst unveränderlich ist.

• Bevorzugen Sie funktionale Methoden wie map, filter und reduce für Operationen auf Arrays.
• Nutzen Sie ES6-Funktionen wie den Spread-Operator und die Destrukturierung für prägnanteren und besser lesbaren Code.

Fazit

JavaScript-Arrays sind ein grundlegender Bestandteil der Sprache und bieten einen robusten Funktionsumfang für die Verarbeitung von Datensammlungen. Wenn Sie die Array-Methoden und -Eigenschaften verstehen und bewährte Verfahren befolgen, können Sie Array-Daten in Ihren JavaScript-Anwendungen effektiv verwalten und bearbeiten.

Practice

Welche der folgenden Möglichkeiten sind Wege, ein Array in JavaScript zu deklarieren?

Array-Literal: var arr = [1, 2, 3, 4, 5];Array-Konstruktor: var arr = new Array(1, 2, 3, 4, 5);Nur mit dem 'new'-Schlüsselwort: var arr = new;Zahlen direkt einbetten: var arr = 1, 2, 3, 4, 5;