In diesem Artikel wird die
-Funktion von JavaScript ausführlich erörtert, die eine Methode für mächtige, aber oft Missverständnisse darstellt. Wir werden erklären, warum es in einigen Fällen besser als reduce
oder map
und andere Methoden ist und wie es komplexe Vorgänge effizient ausführt. Um seine Funktion zu veranschaulichen, haben wir auf einen praktischen Fall angewendet: filter
Umgang mit der Liste der Ärzte reduce
.
Verständnis Funktion
Die Methode kann das Array in einem einzigen oder komplizierteren Format vereinfachen. Seine Grammatik ist wie folgt:
reduce
Die Parameter von
reduce
Akkumulator <code class="language-javascript">array.reduce((accumulator, currentValue, index, array) => {
// 逻辑
return accumulator;
}, initialValue);</code>
Nach dem Login kopieren
Nach dem Login kopieren
: Der in jedem Schritt angesammelte Wert.
reduce
currentValue
: Die Elemente werden derzeit im Array verarbeitet.
- Index : Index (optional) des aktuellen Elements.
Array - : Das gesamte Array (optional).
initialValue
:: Der Anfangswert von: Akkumulator. -
Warum kann besser als
oder - sein
Obwohl und
für Konvertierungs- oder Filterarrays sehr nützlich sind, sind sie nicht so funktional wie - . Das Folgende sind einige mehr überlegene Szenen:
kombiniert den Betrieb
: Verwenden Sie können Sie die Konvertierung und Filterung in einem Schritt vervollständigen, um mehrere Iterationen des Arrays zu vermeiden. reduce
map
komplexes Aggregat filter
:
ermöglicht es, Objekte oder komplexe Strukturen basierend auf dem Array zu erstellen.
map
Leistungsoptimierung filter
: Je weniger Iterationen die Anzahl der Iterationen, desto höher ist die Effizienz des großen Arrays. reduce
reduce
Übung vergleichen
Beispiel 1: Verwenden Sie - , um zu vermitteln
reduce
Beispiel 2: Verwenden Sie , um - zu vermitteln und zu filtern
Tatsächlicher Fall: Behandlung der Arztliste
reduce
Angenommen, wir haben eine Arztliste, die den Namen des Arztes, den Nachnamen, den Code und den Spezialisten enthält. Hier finden Sie, wie wir uns helfen können, Beispiele für verschiedene Operationen durchzuführen. -
Doktorliste
Operation 1: Gemäß der Anzahl der Ärzte in der Hochschulstatistik
map
Operation 2: Erstellen Sie das Wörterbuch, einen Arzt in Ordnung zu finden
<code class="language-javascript">const numbers = [1, 2, 3, 4];
const doubled = numbers.map(n => n * 2);
console.log(doubled); // [2, 4, 6, 8]</code>
Nach dem Login kopieren
reduce
Vorgang 3: Erstellen Sie die vollständige Namensliste der Formatierung
<code class="language-javascript">const numbers = [1, 2, 3, 4];
const result = numbers.reduce((acc, n) => {
if (n % 2 === 0) acc.push(n * 2); // 一步完成过滤和转换
return acc;
}, []);
console.log(result); // [4, 8]</code>
Nach dem Login kopieren
<code class="language-javascript">array.reduce((accumulator, currentValue, index, array) => {
// 逻辑
return accumulator;
}, initialValue);</code>
Nach dem Login kopieren
Nach dem Login kopieren
Die beste Praxis von reduce
Fügen Sie den Anfangswert - hinzu: stets , um Fehler im Luftarray zu vermeiden.
initialValue
Halten Sie die Lesbarkeit : Obwohl - leistungsstarke, übermäßige Verwendung den Code kompliziert machen kann. Verwenden Sie es nur, wenn andere Methoden nicht ausreichen.
Notieren Sie Ihre Logik
reduce
: Erläutern Sie jeden Schritt im Kommentar klar, um das Verständnis zu erleichtern.
-
Schlussfolgerung
Funktion ist nicht nur ein einfaches Reduktionsinstrument. Es kann transformiert werden, die Daten innerhalb eines Schritts filtern und neu organisieren und eindeutige Funktionen in Array -Operationen bietet. Durch einige Übungen können Sie komplexe Operationen in einer Optimierung und Eleganz ausführen. Wie benutzt du im Projekt ? Bitte teilen Sie Ihre Ideen und Erfahrungen in den Kommentaren mit, wir möchten Ihre Fähigkeiten kennen!
Versuchen Sie, zu verwenden und all sein Potenzial in Ihrem Projekt zu entdecken!
Das obige ist der detaillierte Inhalt vonBeherrschen Sie die Reduzierung der JavaScript -Funktion: Eine oft unterschätzte Macht. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!