Array : mthode reduceRight()

Exemple interactif

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

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

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

Syntaxe

reduceRight(callbackFn)
reduceRight(callbackFn, initialValue)

Paramtres

callbackFn

La fonction excuter pour chaque lment du tableau. Sa valeur de retour devient la valeur du paramtre accumulator lors de l'appel suivant de callbackFn. Pour le dernier appel, la valeur de retour devient la valeur retourne par reduceRight(). La fonction est appele avec les arguments suivants :

accumulator

La valeur rsultant de l'appel prcdent de callbackFn. Lors du premier appel, sa valeur est initialValue si ce dernier est dfini ; sinon, sa valeur est le dernier lment du tableau.

currentValue

La valeur de l'lment courant. Lors du premier appel, sa valeur est le dernier lment si initialValue est dfini ; sinon, sa valeur est l'avant-dernier lment.

currentIndex

L'index de currentValue dans le tableau. Lors du premier appel, sa valeur est array.length - 1 si initialValue est dfini, sinon array.length - 2.

array

Le tableau sur lequel reduceRight() a t appel.

initialValue Facultatif

La valeur utiliser comme accumulateur lors du premier appel de la fonction callbackFn. Si aucune valeur initiale n'est fournie, le dernier lment du tableau sera utilis et ignor. Appeler reduceRight() sur un tableau vide sans valeur initiale lve une exception TypeError.

Valeur de retour

La valeur obtenue grce la fonction de rduction.

Description

La mthode reduceRight() est une mthode itrative. Elle excute une fonction de rappel  de rduction  sur tous les lments du tableau, dans l'ordre dcroissant des indices, et les accumule en une seule valeur. Consultez la section mthodes itratives pour plus d'informations sur le fonctionnement gnral de ces mthodes.

callbackFn n'est appele que pour les indices du tableau qui ont des valeurs attribues. Elle n'est pas appele pour les cases vides dans un tableau creux.

Contrairement aux autres mthodes itratives, reduceRight() n'accepte pas d'argument thisArg. callbackFn est toujours appele avec la valeur undefined pour this, qui est remplace par globalThis si callbackFn n'est pas en mode strict.

La mthode reduceRight() est gnrique. Elle attend seulement que la valeur de this possde une proprit length et des proprits cls entires.

Toutes les mises en garde concernant reduce voques dans Quand ne pas utiliser reduce() s'appliquent aussi reduceRight. Comme JavaScript ne possde pas de smantique d'valuation paresseuse, il n'y a aucune diffrence de performance entre reduce et reduceRight.

Exemples

Fonctionnement de reduceRight() sans valeur initiale

L'appel la fonction de rappel callbackFn de reduceRight ressemblerait ceci :

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

La premire fois que la fonction est appele, accumulator et currentValue peuvent prendre deux valeurs diffrentes. Si une initialValue est fournie lors de l'appel reduceRight, alors accumulator sera gal initialValue et currentValue sera gal la dernire valeur du tableau. Si aucune initialValue n'est fournie, alors accumulator sera gal la dernire valeur du tableau et currentValue sera gal l'avant-dernire valeur.

Si le tableau est vide et qu'aucune initialValue n'est fournie, TypeError sera leve. Si le tableau ne contient qu'un seul lment (peu importe sa position) et qu'aucune initialValue n'est fournie, ou si initialValue est fournie mais que le tableau est vide, la valeur unique sera retourne sans appeler callbackFn.

Voici quelques exemples d'excution de la fonction :

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

La fonction de rappel sera appele quatre fois, avec les arguments et valeurs de retour suivants chaque appel :

Le paramtre array ne change jamais pendant le processus : il reste toujours [0, 1, 2, 3, 4]. La valeur retourne par reduceRight sera celle du dernier appel de la fonction de rappel (10).

Fonctionnement de reduceRight() avec une valeur initiale

Ici, on rduit le mme tableau avec le mme algorithme, mais en passant une initialValue de 10 comme second argument reduceRight() :

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

La valeur retourne par reduceRight dans ce cas sera bien sr 20.

Additionner toutes les valeurs d'un tableau

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

Excuter une liste de fonctions asynchrones avec des rappels en srie, chaque rsultat tant pass la suivante

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 mul3 = (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, mul3, sub2, split, add, div4);
computation(console.log, 5); // Affiche 14

// quivalent  :

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) => mul3(f3, x);
  add5(f2, input);
};

Diffrence entre reduce et reduceRight

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

console.log(gauche); // "12345"
console.log(droite); // "54321"

Dfinir des fonctions composables

La composition de fonctions est un mcanisme permettant de combiner des fonctions, o la sortie de chaque fonction est passe la suivante, et la sortie de la dernire fonction est le rsultat final. Dans cet exemple, on utilise reduceRight() pour implmenter la composition de fonctions.

Voir aussi Composition de fonctions (angl.) sur Wikipdia.

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

// Incrmente le nombre pass en argument
const inc = (n) => n + 1;

// Double la valeur passe en argument
const double = (n) => n * 2;

// Utilisation de la fonction de composition
console.log(compose(double, inc)(2)); // 6

// Utilisation de la fonction de composition
console.log(compose(inc, double)(2)); // 5

Utiliser reduceRight() avec des tableaux creux

reduceRight() ignore les lments manquants dans les tableaux creux, mais n'ignore pas les valeurs undefined.

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

Appeler reduceRight() sur des objets ressemblant des tableaux

La mthode reduceRight() lit la proprit length de this puis accde chaque proprit dont la cl est un entier non ngatif infrieur length.

const objetSimilaireTableau = {
  length: 3,
  0: 2,
  1: 3,
  2: 4,
  3: 99, // ignor par reduceRight() car length vaut 3
};
console.log(
  Array.prototype.reduceRight.call(objetSimilaireTableau, (x, y) => x - y),
);
// -1, soit 4 - 3 - 2

Spcifications

Compatibilit des navigateurs

Voir aussi

• Guide des collections indexes
• L'objet global Array
• La mthode Array.prototype.map()
• La mthode Array.prototype.flat()
• La mthode Array.prototype.flatMap()
• La mthode Array.prototype.reduce()
• La mthode TypedArray.prototype.reduceRight()
• La mthode Object.groupBy()
• La mthode Map.groupBy()
• Prothse d'mulation de Array.prototype.reduceRight dans core-js (angl.)
• Prothse d'mulation es-shims de Array.prototype.reduceRight (angl.)