Array.Reduce, c'est quoi ?

Introduction

Le callback prend en entrée l’élément courant, l’index de l’élément courant et le tableau en entier. Le callback doit retourner une valeur. Cette valeur sera utilisée pour le prochain élément du tableau. La valeur de retour de la fonction reduce est la valeur retournée par le dernier appel du callback.

Si on ne fournit pas de valeur initiale, la valeur initiale sera le premier élément du tableau et le callback sera appelé sur le deuxième élément du tableau.

Démonstration

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((total, number) => total + number, 0);

// 0 + 1 -> 1
// 1 + 2 -> 3
// 3 + 3 -> 6
// 6 + 4 -> 10

Par exemple, pour transformer un tableau d’objet en object avec les id en key :

const list = [{ id: 100, name: 'Ed' }, { id: 200, name: 'Al' }];

const obj = list.reduce((final, current) => {
    final[current.id] = current;
    return final;
}, {});

// {100: {id: 100, name: 'Ed'}, 200: {id: 200, name: 'Al'}}

Cela équivaut à un forEach comme ceci :

const list = [{ id: 100, name: 'Ed' }, { id: 200, name: 'Al' }];

const obj = {};
list.forEach(e => obj[e.id] = e);