array.find() Array-Element suchen / finden
array.find() ist eine eingebaute Funktion und gibt den Wert des ersten Elements zurück, das die angegebenen Bedingungen erfüllt, oder undefined, falls kein Element gefunden wurde.
Seit ES5 können wir mit indexOf und lastIndexOf Elemente in Arrays aufspüren. Diese Methoden geben allerdings nur den Index des ersten passenden Elements zurück. array.find() hingegen gibt Zugriff auf das gefundene Element.
const numbers = [1, 5, 18, 7, 4]; // callback-Funktion function bar (e, idx, arr) { // console.log (idx); // console.log (arr); return e % 3 == 0; } const f = numbers.find(bar); console.log ("f", f) // f – 18
oder kurz per Arrow-Funktion
const f = numbers.find (e => e % 3 == 0) ;
Findet das erste Element, das durch 3 teilbar ist und gibt es in numbers zurück.
- e
- Aktuelles Element, das von der Funktion bearbeitet wird
- idx – optional
- Index des aktuellen Elements
- arr - optional
- Das Array, in dem gesucht wird
- thisArg - optional
- weist die Funktion an, dieses Argument als this in der Callback-Funktion zu nutzen.
Array.find() und JSON
Mit array.find () ein Element in einem JSON-Array of Objects finden
const haustiere = [ { "name" : "Marsalla", "spezies" : "🐈", "age": 8}, { "name" : "Theokrates", "spezies" : "🐕", "age": 4 }, { "name" : "Wallis", "spezies" : "🐎", "age": 18 }, { "name" : "Nemo", "spezies" : "🐑", "age": 12 } ]; const foo = haustiere.find(elem => elem.age > 8); console.log ("foo", foo)
zeigt den ersten Treffer:
{ "name" : "Wallis", "spezies" : "🐎", "age": 18 }
Helferfunktion: array.copyWithin ()
copyWithin () kopiert Elemente des Arrays auf eine andere Position im Arrays und überschreibt dabei die vorhandenen Elemente. copyWithin fügt dem Array also keine neuen Elemente hinzu, ist aber destruktiv: Das Array wird geändert.
const fruits = ["🍋", "🌶", "🍎", "🍒", "🍐"]; fruits.copyWithin(2, 0); | | ziel + +-- start
kopiert die Elemente von Startplatz 0 des Arrays auf die Zielposition ab Platz 2.
const animals = ["🐈", "🐋", "🐖", "🐙", "🐟", "🐿"]; animals.copyWithin(2, 0, 2); | | | ziel ---+ | +--- ende + start
Mit drei Parametern:
array.fill ()
array.fill füllt das Array mit Werten und überschreibt dabei vorhandene Elemente – ist also destruktiv.
const cloth = ["👗", "👚", "👠", "👢"]; cloth.fill("👠"); cloth.fill("👗", 2, 4);