js verwendet die Reduce-Methode, um Ihren Code eleganter zu gestalten

Vorwort

In tatsächlichen Projekten kann die häufigste Verarbeitung in der Berechnung und Schleifenlogik liegen. Sie können die Reduzierungsmethode im Array verwenden, um viele Probleme zu lösen und Ihren Codestil eleganter zu gestalten!

Syntax reduzieren

arr.reduce(Rückruf(Akkumulator, aktuellerWert[, Index[, Array]])[, Anfangswert])

Parameter Beschreibung

Die Reducer-Funktion muss 4 Parameter erhalten:

Rückruf

• Akkumulator
  • Der Akkumulator akkumuliert den Rückgabewert des Rückrufs. Dies ist der akkumulierte Wert, der vom letzten Aufruf des Rückrufs zurückgegeben wurde, oder der Anfangswert.
• Aktueller Wert
  • Das Element im Array, das verarbeitet wird.
• Aktueller Index
  • Dies ist ein optionaler Parameter, der Index des aktuellen Elements im verarbeiteten Array. Wenn initialValue angegeben ist, ist der Startindex 0, andernfalls beginnt er beim Index 1.
• Quell-Array
  • Dies ist ein optionaler Parameter, das Array, für das „reduce()“ aufgerufen werden soll.

Anfangswert

• Der Wert, der als erstes Argument verwendet werden soll, wenn die Rückruffunktion zum ersten Mal aufgerufen wird. Wenn kein Anfangswert angegeben ist, wird das erste Element im Array verwendet. Der Aufruf von „Reduce“ für ein leeres Array ohne Anfangswert führt zu einem Fehler.

Rückgabewert

• Das Ergebnis der Funktionsakkumulationsverarbeitung

Einige gängige Reduzierungsmethoden

Die Summe aller Elemente im Array

const arr = [1, 2, 3, 4];
const Ergebnis = arr.reduce((acc, cur) => acc + cur)
​
console.log(Ergebnis) // 10

Zählen Sie, wie oft jedes Element in einem Array vorkommt

Konstantennummern = ['1', '1', '1', '2', '3'];
const countednums = nums.reduce((acc, cur) => { 
  wenn (aktuell in acc) {
    acc[aktuell]++;
  }
  anders {
    acc[aktuell] = 1;
  }
  Rückgabe gem.
}, {});
​
console.log(Anzahl); // {1: 3, 2: 1, 3: 1}

Reduzieren eines Arrays

const arr = [['a', 'b'], ['b', 'c'], ['d', 'e']]
const flatten = arr => {
  returniere arr.reduce((acc, cur) => {
    returniere acc.concat(aktuell)
  }, [])
}
​
konsole.log(flatten(arr)); // ["a", "b", "b", "c", "d", "e"]

Array-Deduplizierung

Konstanten arr = [22,341,124,54,4,21,4,4,1,4,4];
const Ergebnis = arr.sort().reduce((acc, cur) => {
    wenn(acc.length === 0 || acc[acc.length-1] !== cur) {
        acc.push(aktuell);
   }
    Rückgabe gem.
}, []);
​
console.log(Ergebnis); // [1, 124, 21, 22, 341, 4, 54]

Finden Sie den Maximalwert in einem Array

const arr = [1, 2, 3, 5, 1]
lass Ergebnis = arr.reduce((acc, cur) => Math.max(acc, cur))
​
console.log(Ergebnis)

Versprechen werden in der Reihenfolge aufgerufen

Diese Methode verarbeitet tatsächlich den Wert des Versprechens und verarbeitet den Wert des vorherigen Versprechens als Wert des nächsten Versprechens.

const prom1 = a => {
  gib ein neues Versprechen zurück((resolve => {
    Entschlossenheit (a)
  }))
}
const prom2 = a => {
  gib ein neues Versprechen zurück((resolve => {
    Auflösung(a * 2)
  }))
}
const prom3 = a => {
  gib ein neues Versprechen zurück((resolve => {
    Lösung (a * 3)
  }))
}

const arr = [prom1, prom2, prom3]
const Ergebnis = arr.reduce((alle, aktuell) => {
  gib alles zurück.dann(aktuell)
}, Versprechen.lösen(10))

Ergebnis.dann(res => {
  konsole.log(res);
})

endlich

In diesem Artikel werden einige Reduce-Verarbeitungsmethoden beschrieben, die in der täglichen Entwicklung häufig verwendet werden. Sie können sie direkt in Ihrem Projekt verwenden oder neu verpacken.

Dies ist das Ende dieses Artikels darüber, wie Sie die Reduce-Methode in js verwenden, um Ihren Code eleganter zu gestalten. Weitere relevante Inhalte zur js-Reduce-Methode, um den Code eleganter zu gestalten, finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!