Programmation fonctionnelle en javascript – map, filter et reduce

Même si vous ne savez pas quelle est la programmation fonctionnelle, vous avez probablement déjà utilisé map, filter et reduce simplement parce qu’elles sont extrêmement utiles et réduisent les bugs dans votre code en vous permettant d’écrire une logique plus propre.
 
 

Méthode map

La méthode map() crée un nouveau tableau avec les résultats de l’appel d’une fonction fournie sur chaque élément du tableau appelant.

Considérez une map comme une boucle « for each », une valeur d’entrée correspond à une valeur de sortie « transformée ».

Prenons un code simple :

var nbrs = [1, 2, 3, 4, 5];
var res = [];

for(var i = 0; i < nbrs.length; i++) {
    res[i] = nbrs[i] * 2;
}

console.log(res); // [2, 4, 6, 8, 10]

Bien que ce code fonctionne, il n’est pas très agréable. Il faut beaucoup de travail pour faire une tâche assez simple – multiplier par 2 tous les nombres dans un tableau.

Nous pouvions simplement écrire ce code en utilisant la méthode map() comme suivant.

var nbrs = [1, 2, 3, 4, 5];

var res = nbrs.map(function(n){
    return n * 2;
});

console.log(res); // [2, 4, 6, 8, 10]

Donc, nous n’avons plus besoin d’une boucle, et nous n’avons pas besoin non plus d’ajouter manuellement des nombres à un tableau!
 

Méthode filter

La méthode filter() crée un nouveau tableau avec tous les éléments qui réussissent le test implémenté par la fonction fournie.
 
Exemple :

const mots = ["singe", "également", "faire", "certainement"];

const longMots = mots.filter(mot => mot.length > 6);

console.log("Les mots les plus longs : "+ longMots);

Sortie :

Les mots les plus longs : également, certainement

 

Méthode reduce

La méthode reduce() applique une fonction sur un accumulateur et sur chaque élément du tableau (de gauche à droite) pour le réduire à une valeur unique.
 
Exemple :

const total = [0, 1, 2, 3];

const res = total.reduce((sum,value) => {
  return sum + value;
});

console.log(res); // 6