Array-Methoden verketten
Teil des Abschnitts Logik & Ablauf der JavaScript-Journey von Coddy. Lektion 55 von 65.
Das Verkettungsprinzip (Chaining) von Arrays ermöglicht es Ihnen, mehrere Operationen auf einem Array in einer einzigen Anweisung auszuführen. Dieser Ansatz kann Ihren Code prägnanter und lesbarer machen.
Hier ist ein Beispiel für das Verketten von Array-Methoden:
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const result = numbers
.filter(num => num % 2 === 0)
.map(num => num * 2)
.reduce((sum, num) => sum + num, 0);
console.log(result); // 60In diesem Beispiel beginnen wir mit einem Array von Zahlen, filtern die ungeraden Zahlen heraus, verdoppeln jede verbleibende Zahl und summieren die Ergebnisse auf.
Die Reihenfolge der Verkettung ist wichtig. Jede Methode in der Kette arbeitet auf dem Ergebnis der vorherigen Methode.
Aufgabe
EinfachErstelle eine Funktion namens processFruits, die ein Array von Obst-Objekten entgegennimmt. Jedes Obst-Objekt hat die Eigenschaften name (String) und quantity (Zahl).
Die Funktion sollte verkettete Array-Methoden verwenden, um:
- Früchte mit einer
quantityvon 0 herauszufiltern - Jeden Frucht-Namen in Großbuchstaben umzuwandeln
- Einen String zu erstellen, der alle Früchte mit ihren Mengen auflistet, wie "APPLE: 5, BANANA: 3"
Eine kurze Erinnerung:
Du kannst die Funktion .join(", ") verwenden, um ein Array von Strings in einen einzelnen String umzuwandeln.
Es ist möglich, selbst die Funktion .join() zu verketten:
arr.filter(...)
.map(...)
.join(...)Probier es selbst
function processFruits(fruits) {
// Schreibe deinen Code hier
}
Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Alle Lektionen in Logik & Ablauf
1Strings im Detail
Grundlagen von StringsStrings durchlaufenTemplate LiteralsString-MethodenRückblick – String-Weber4JSON Teil 2
JSON durchlaufenVerschachteltes JSONOptionale Verkettung in JSONFlache und tiefe KopieWiederholung – FahrradgeschäftWiederholung – Sonnensystem7Bibliotheksverwaltungssystem
ProjektübersichtBücher hinzufügen2Mehrdimensionale Arrays
Grundlagen von 2D-ArraysZugriff auf Elemente von 2D-ArraysVerschachtelte Schleifen mit 2D-ArraysWiederholung – 2D-ArraysMatrixaddition und -subtraktionZackige Arrays3D-Arrays und darüber hinausHäufige Muster bei 2D-ArraysWiederholung – Alles über Arrays5Mengen – Teil 1
Was ist eine Menge?Mengen durchlaufenEin Element hinzufügenEin Element entfernenPrüfen, ob ein Element vorhanden istGröße und LeerstatusKopieren und LeerenRückblick – Grundlagen von Mengen8Interessante Themen zu Arrays
Destrukturierung von ArraysSpread-Syntax in ArraysDünn besetzte ArraysRückblick – Workshop zu Arrays3JSON Teil 1
Was ist JSON?Prüfen, ob ein Schlüssel vorhanden istObjektmethodenSpread-Operator Teil 1Spread-Operator Teil 2Schlüssel entfernenRückblick – JSON-Schlüssel bearbeiten6Mengen Teil 2
Mathematik – Vereinigung von MengenMathematik – Schnittmenge von MengenMathematik – Differenz von MengenMathematik – Symmetrische DifferenzTeilmengen und ObermengenRückblick – Freunde gruppieren9Erweiterte Array-Methoden
Die Join- und Split-MethodenDie Map-MethodeDie Filter-MethodeDie Reduce-MethodeArray-Methoden verkettenSind ForEach und Map gleich?Die Sort-MethodeDie Find- und FindIndex-MethodeRückblick – Der Chain-MeisterÜbe selbstständig: Online-JavaScript-Compiler