Array.prototype.reduceRight()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Die reduceRight()-Methode von Array-Instanzen wendet eine Funktion gegen einen Akkumulator und jeden Wert des Arrays (von rechts nach links) an, um es zu einem einzigen Wert zu reduzieren.

Siehe auch Array.prototype.reduce() für links-nach-rechts.

Probieren Sie es aus

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

const result = array1.reduceRight((accumulator, currentValue) =>
  accumulator.concat(currentValue),
);

console.log(result);
// Expected output: Array [4, 5, 2, 3, 0, 1]

Syntax

js
reduceRight(callbackFn)
reduceRight(callbackFn, initialValue)

Parameter

callbackFn

Eine Funktion, die für jedes Element im Array ausgeführt wird. Ihr Rückgabewert wird der Wert des accumulator-Parameters beim nächsten Aufruf von callbackFn. Beim letzten Aufruf wird der Rückgabewert der Rückgabewert von reduceRight(). Die Funktion wird mit den folgenden Argumenten aufgerufen:

accumulator

Der Wert, der aus dem vorherigen Aufruf von callbackFn resultiert. Beim ersten Aufruf ist sein Wert initialValue, falls letzterer angegeben ist; andernfalls ist sein Wert das letzte Element des Arrays.

currentValue

Der Wert des aktuellen Elements. Beim ersten Aufruf ist sein Wert das letzte Element, falls initialValue angegeben ist; andernfalls ist sein Wert das vorletzte Element.

currentIndex

Die Indexposition von currentValue im Array. Beim ersten Aufruf ist sein Wert array.length - 1 falls initialValue angegeben ist, andernfalls array.length - 2.

array

Das Array, auf das reduceRight() aufgerufen wurde.

initialValue Optional

Wert, der als Akkumulator beim ersten Aufruf von callbackFn verwendet wird. Wenn kein Anfangswert angegeben ist, wird das letzte Element im Array verwendet und übersprungen. Das Aufrufen von reduceRight() auf einem leeren Array ohne Anfangswert erzeugt einen TypeError.

Rückgabewert

Der Wert, der aus der Reduktion resultiert.

Beschreibung

Die reduceRight()-Methode ist eine iterative Methode. Sie führt eine "Reducer"-Callback-Funktion über alle Elemente im Array in absteigender Index-Reihenfolge aus und akkumuliert sie zu einem einzigen Wert. Lesen Sie den Abschnitt über iterative Methoden für weitere Informationen darüber, wie diese Methoden allgemein funktionieren.

callbackFn wird nur für Array-Indizes aufgerufen, denen Werte zugewiesen sind. Es wird nicht für leere Plätze in sparse arrays aufgerufen.

Im Gegensatz zu anderen iterativen Methoden akzeptiert reduceRight() kein thisArg-Argument. callbackFn wird immer mit undefined als this aufgerufen, das durch globalThis ersetzt wird, wenn callbackFn nicht streng ist.

Die reduceRight()-Methode ist generisch. Sie erwartet nur, dass der this-Wert eine length-Eigenschaft und integer-bezogene Eigenschaften hat.

Alle Vorbehalte bezüglich reduce, die unter when to not use reduce() diskutiert wurden, gelten auch für reduceRight. Da JavaScript keine lazy evaluation Semantik besitzt, gibt es keinen Leistungsunterschied zwischen reduce und reduceRight.

Beispiele

Wie reduceRight() ohne Anfangswert funktioniert

Der Aufruf der reduceRight-callbackFn würde ungefähr so aussehen:

js
arr.reduceRight((accumulator, currentValue, index, array) => {
  // …
});

Beim ersten Aufruf der Funktion können der accumulator und currentValue zwei Werte haben. Wenn ein initialValue im Aufruf von reduceRight angegeben wurde, dann wird accumulator gleich initialValue und currentValue wird gleich dem letzten Wert im Array. Wenn kein initialValue angegeben wurde, dann wird accumulator gleich dem letzten Wert im Array und currentValue wird gleich dem vorletzten Wert.

Wenn das Array leer ist und kein initialValue angegeben wurde, würde ein TypeError ausgelöst. Wenn das Array nur ein Element hat (unabhängig von der Position) und kein initialValue angegeben wurde, oder wenn initialValue angegeben wurde, aber das Array leer ist, wird der einzelne Wert zurückgegeben, ohne callbackFn aufzurufen.

Einige Beispiele für die Ausführung der Funktion könnten so aussehen:

js
[0, 1, 2, 3, 4].reduceRight(
  (accumulator, currentValue, index, array) => accumulator + currentValue,
);

Der Callback würde viermal aufgerufen, mit den Argumenten und Rückgabewerten in jedem Aufruf wie folgt:

accumulator currentValue index Rückgabewert
Erster Aufruf 4 3 3 7
Zweiter Aufruf 7 2 2 9
Dritter Aufruf 9 1 1 10
Vierter Aufruf 10 0 0 10

Der array-Parameter ändert sich während des Prozesses nie - es ist immer [0, 1, 2, 3, 4]. Der von reduceRight zurückgegebene Wert wäre der des letzten Callback-Aufrufs (10).

Wie reduceRight() mit einem Anfangswert funktioniert

Hier reduzieren wir dasselbe Array mit demselben Algorithmus, aber mit einem initialValue von 10, das als zweites Argument an reduceRight() übergeben wird:

js
[0, 1, 2, 3, 4].reduceRight(
  (accumulator, currentValue, index, array) => accumulator + currentValue,
  10,
);
accumulator currentValue index Rückgabewert
Erster Aufruf 10 4 4 14
Zweiter Aufruf 14 3 3 17
Dritter Aufruf 17 2 2 19
Vierter Aufruf 19 1 1 20
Fünfter Aufruf 20 0 0 20

Der von reduceRight zurückgegebene Wert wäre in diesem Fall natürlich 20.

Alle Werte innerhalb eines Arrays aufsummieren

js
const sum = [0, 1, 2, 3].reduceRight((a, b) => a + b);
// sum is 6

Eine Liste asynchroner Funktionen mit Rückrufen in Serie ausführen, wobei jeweils ihre Ergebnisse an die nächste übergeben werden

js
const waterfall =
  (...functions) =>
  (callback, ...args) =>
    functions.reduceRight(
      (composition, fn) =>
        (...results) =>
          fn(composition, ...results),
      callback,
    )(...args);

const randInt = (max) => Math.floor(Math.random() * max);

const add5 = (callback, x) => {
  setTimeout(callback, randInt(1000), x + 5);
};
const mult3 = (callback, x) => {
  setTimeout(callback, randInt(1000), x * 3);
};
const sub2 = (callback, x) => {
  setTimeout(callback, randInt(1000), x - 2);
};
const split = (callback, x) => {
  setTimeout(callback, randInt(1000), x, x);
};
const add = (callback, x, y) => {
  setTimeout(callback, randInt(1000), x + y);
};
const div4 = (callback, x) => {
  setTimeout(callback, randInt(1000), x / 4);
};

const computation = waterfall(add5, mult3, sub2, split, add, div4);
computation(console.log, 5); // Logs 14

// same as:

const computation2 = (input, callback) => {
  const f6 = (x) => div4(callback, x);
  const f5 = (x, y) => add(f6, x, y);
  const f4 = (x) => split(f5, x);
  const f3 = (x) => sub2(f4, x);
  const f2 = (x) => mult3(f3, x);
  add5(f2, input);
};

Unterschied zwischen reduce und reduceRight

js
const a = ["1", "2", "3", "4", "5"];
const left = a.reduce((prev, cur) => prev + cur);
const right = a.reduceRight((prev, cur) => prev + cur);

console.log(left); // "12345"
console.log(right); // "54321"

Definieren komposierbarer Funktionen

Funktionskomposition ist ein Mechanismus zur Kombination von Funktionen, bei dem die Ausgabe jeder Funktion in die nächste übergeben wird und die Ausgabe der letzten Funktion das endgültige Ergebnis ist. In diesem Beispiel verwenden wir reduceRight(), um Funktionskomposition zu implementieren.

Siehe auch Funktionskomposition auf Wikipedia.

js
const compose =
  (...args) =>
  (value) =>
    args.reduceRight((acc, fn) => fn(acc), value);

// Increment passed number
const inc = (n) => n + 1;

// Doubles the passed value
const double = (n) => n * 2;

// using composition function
console.log(compose(double, inc)(2)); // 6

// using composition function
console.log(compose(inc, double)(2)); // 5

Verwendung von reduceRight() mit dünn besetzten Arrays

reduceRight() überspringt fehlende Elemente in dünn besetzten Arrays, überspringt jedoch keine undefined-Werte.

js
console.log([1, 2, , 4].reduceRight((a, b) => a + b)); // 7
console.log([1, 2, undefined, 4].reduceRight((a, b) => a + b)); // NaN

Aufruf von reduceRight() auf Nicht-Array-Objekten

Die reduceRight()-Methode liest die length-Eigenschaft von this und greift dann auf jede Eigenschaft zu, deren Schlüssel eine nicht-negative Ganzzahl kleiner als length ist.

js
const arrayLike = {
  length: 3,
  0: 2,
  1: 3,
  2: 4,
  3: 99, // ignored by reduceRight() since length is 3
};
console.log(Array.prototype.reduceRight.call(arrayLike, (x, y) => x - y));
// -1, which is 4 - 3 - 2

Spezifikationen

Specification
ECMAScript® 2025 Language Specification
# sec-array.prototype.reduceright

Browser-Kompatibilität

Siehe auch