Arrays sind eine der grundlegendsten Datenstrukturen in JavaScript. Mit einem Array können Sie mehrere Werte in einer einzigen Variablen speichern. JavaScript bietet zahlreiche integrierte Methoden zum Bearbeiten von Arrays, was sie unglaublich vielseitig macht. In diesem Beitrag untersuchen wir alle integrierten Array-Methoden und wie Sie sie effektiv in Ihren JavaScript-Projekten verwenden.

Kernmethoden

forEach()

Mit der forEach()-Methode können Sie ein Array durchlaufen und eine bereitgestellte Funktion einmal für jedes Element im Array ausführen. Es ist eine einfache Möglichkeit, ein Array zu durchlaufen.

const array = [1, 2, 3, 4, 5];

array.forEach((element) => {
  console.log(element);
});

Karte()

Die Methode „map()“ erstellt ein neues Array, das mit den Ergebnissen des Aufrufs einer bereitgestellten Funktion für jedes Element im Array gefüllt wird. Es wird normalerweise zum Transformieren von Daten verwendet.

const array = [1, 2, 3, 4, 5];

const doubled = array.map((element) => element * 2);

console.log(doubled); // [2, 4, 6, 8, 10]

Filter()

Die Methode filter() erstellt ein neues Array mit allen Elementen, die den von der bereitgestellten Funktion implementierten Test bestehen. Dies ist nützlich, wenn Sie bestimmte Elemente aus einem Array basierend auf einer Bedingung herausfiltern müssen.

const array = [1, 2, 3, 4, 5];

const evenNumbers = array.filter((element) => element % 2 === 0);

console.log(evenNumbers); // [2, 4]

reduzieren()

Die Methode Reduce() führt eine Reduzierfunktion für jedes Element des Arrays aus, was zu einem einzelnen Ausgabewert führt. Es wird häufig zum Summieren von Werten, zum Akkumulieren von Summen oder zum Zusammenführen von Arrays zu einem einzelnen Wert verwendet.

const array = [1, 2, 3, 4, 5];

const sum = array.reduce((accumulator, currentValue) => accumulator   currentValue, 0);

console.log(sum); // 15

finden()

Die Methode find() gibt den Wert des ersten Elements im Array zurück, das die bereitgestellte Testfunktion erfüllt. Es stoppt, nachdem die erste Übereinstimmung gefunden wurde.

const array = [1, 2, 3, 4, 5];

const found = array.find((element) => element > 3);

console.log(found); // 4

findIndex()

Die Methode findIndex() gibt den Index des ersten Elements im Array zurück, das die bereitgestellte Testfunktion erfüllt. Wenn kein Element die Testfunktion erfüllt, wird -1 zurückgegeben.

const array = [1, 2, 3, 4, 5];

const index = array.findIndex((element) => element > 3);

console.log(index); // 3

Sortieren()

Die Methode sort() sortiert die Elemente eines Arrays an Ort und Stelle und gibt das sortierte Array zurück. Es wird häufig zum Sortieren von Zeichenfolgen und Zahlen verwendet, erfordert jedoch möglicherweise eine Vergleichsfunktion, um Zahlen korrekt zu sortieren.

const array = [5, 3, 8, 1, 2];

const sortedArray = array.sort((a, b) => a - b);

console.log(sortedArray); // [1, 2, 3, 5, 8]

umkehren()

Die Methode reverse() kehrt die Elemente eines Arrays an ihrer Stelle um. Das erste Array-Element wird zum letzten und das letzte zum ersten.

const array = [1, 2, 3, 4, 5];

const reversedArray = array.reverse();

console.log(reversedArray); // [5, 4, 3, 2, 1]

concat()

Die Methode concat() wird verwendet, um zwei oder mehr Arrays zusammenzuführen. Es wird ein neues Array zurückgegeben, wobei die ursprünglichen Arrays unverändert bleiben.

const array1 = [1, 2, 3];
const array2 = [4, 5, 6];

const concatenatedArray = array1.concat(array2);

console.log(concatenatedArray); // [1, 2, 3, 4, 5, 6]

Scheibe()

Die Methode „slice()“ gibt eine flache Kopie eines Teils eines Arrays in ein neues Array-Objekt zurück, das vom Anfang bis zum Ende ausgewählt wird (Ende nicht eingeschlossen).

const array = [1, 2, 3, 4, 5];

const slicedArray = array.slice(1, 4);

console.log(slicedArray); // [2, 3, 4]

spleißen()

Die splice()-Methode ändert den Inhalt eines Arrays durch Entfernen, Ersetzen oder Hinzufügen von Elementen.

const array = [1, 2, 3, 4, 5];

array.splice(2, 1, 6, 7);

console.log(array); // [1, 2, 6, 7, 4, 5]

drücken()

Die push()-Methode fügt ein oder mehrere Elemente am Ende eines Arrays hinzu und gibt die neue Länge des Arrays zurück.

const array = [1, 2, 3];

array.push(4, 5);

console.log(array); // [1, 2, 3, 4, 5]

Pop()

Die Methode pop() entfernt das letzte Element aus einem Array und gibt dieses Element zurück.

const array = [1, 2, 3, 4, 5];

const lastElement = array.pop();

console.log(lastElement); // 5
console.log(array); // [1, 2, 3, 4]

Schicht()

Die Methode „shift()“ entfernt das erste Element aus einem Array und gibt dieses Element zurück.

const array = [1, 2, 3, 4, 5];

const firstElement = array.shift();

console.log(firstElement); // 1
console.log(array); // [2, 3, 4, 5]

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 array = [2, 3, 4, 5];

array.unshift(1);

console.log(array); // [1, 2, 3, 4, 5]

verbinden()

Die Methode „join()“ erstellt eine neue Zeichenfolge und gibt sie zurück, indem sie alle Elemente in einem Array verkettet, getrennt durch Kommas oder eine angegebene Trennzeichenfolge.

const array = [1, 2, 3, 4, 5];

const joinedString = array.join('-');

console.log(joinedString); // "1-2-3-4-5"

Zusätzliche Methoden

jeder()

Die Methode every() testet, ob alle Elemente im Array die bereitgestellte Testfunktion bestehen.

const array = [2, 4, 6, 8];

const allEven = array.every((element) => element % 2 === 0);

console.log(allEven); // true

manche()

Die Methode some() testet, ob mindestens ein Element im Array die bereitgestellte Testfunktion besteht.

const array = [1, 2, 3, 4, 5];

const hasEven = array.some((element) => element % 2 === 0);

console.log(hasEven); // true

Wohnung()

Die flat()-Methode erstellt ein neues Array, in dem alle Unterarray-Elemente rekursiv bis zur angegebenen Tiefe verkettet sind.

const array = [1, [2, [3, [4]]]];

const flattenedArray = array.flat(2);

console.log(flattenedArray); // [1, 2, 3, [4]]

flatMap()

Die flatMap()-Methode ordnet zunächst jedes Element mithilfe einer Zuordnungsfunktion zu und glättet dann das Ergebnis in ein neues Array. Es ist eine Kombination aus map() und flat().

const array = [1, 2, 3, 4];

const flattened = array.flatMap((num) => [num, num * 2]);

console.log(flattened); // [1, 2, 2, 4, 3, 6, 4, 8]

füllen()

Die Methode fill() füllt alle Elemente eines Arrays mit einem statischen Wert von einem Startindex bis zu einem Endindex.

const array = [1, 2, 3, 4, 5];

array.fill(0, 2, 4);

console.log(array); // [1, 2, 0, 0, 5]

copyWithin()

Die Methode copyWithin() kopiert flach einen Teil eines Arrays an eine andere Stelle im selben Array, ohne seine Länge zu ändern.

const array = [1, 2, 3, 4, 5];

array.copyWithin(0, 3, 5);

console.log(array); // [4, 5, 3, 4, 5]

beinhaltet()

Die Methode Includes() prüft, ob ein Array einen bestimmten Wert enthält.

const array = [1, 2, 3, 4, 5];

const hasThree =

 array.includes(3);

console.log(hasThree); // true

toString()

Die toString()-Methode wandelt ein Array in einen durch Kommas getrennten String um.

const array = [1, 2, 3, 4, 5];

const arrayString = array.toString();

console.log(arrayString); // "1,2,3,4,5"

indexOf()

Die Methode indexOf() gibt den ersten Index zurück, an dem ein bestimmtes Element im Array gefunden werden kann, oder -1, wenn es nicht vorhanden ist.

const array = [1, 2, 3, 4, 5];

const index = array.indexOf(3);

console.log(index); // 2

lastIndexOf()

Die Methode lastIndexOf() gibt den letzten Index zurück, an dem ein bestimmtes Element im Array gefunden werden kann, oder -1, wenn es nicht vorhanden ist.

const array = [1, 2, 3, 4, 3, 5];

const lastIndex = array.lastIndexOf(3);

console.log(lastIndex); // 4

aus()

Die Methode Array.from() erstellt eine neue Array-Instanz aus einem Array-ähnlichen oder iterierbaren Objekt.

const array = Array.from('hello');

console.log(array); // ['h', 'e', 'l', 'l', 'o']

isArray()

Die Methode Array.isArray() prüft, ob der übergebene Wert ein Array ist.

const array = [1, 2, 3, 4, 5];
const notArray = { a: 1, b: 2 };

console.log(Array.isArray(array)); // true
console.log(Array.isArray(notArray)); // false

von()

Die Methode Array.of() erstellt eine neue Array-Instanz mit einer variablen Anzahl von Elementen.

const array1 = Array.of(1, 2, 3);
const array2 = Array.of('a', 'b', 'c');

console.log(array1); // [1, 2, 3]
console.log(array2); // ['a', 'b', 'c']

Abschluss

JavaScript-Arrays verfügen über eine Vielzahl integrierter Methoden, die eine leistungsstarke Datenbearbeitung ermöglichen. Wenn Sie diese Methoden verstehen, können Sie saubereren und prägnanteren Code effizienter schreiben. Nehmen Sie sich etwas Zeit, mit diesen Methoden zu experimentieren und herauszufinden, wie sie Ihren Code verbessern können.
Ursprünglich veröffentlicht: Leitfaden zu JavaScript-Array-Methoden