Comprendre les méthodes d'itérateur de tableau dans JS : filtrer, mapper et réduire

JavaScript dispose de méthodes d'itération intégrées pour la transformation de tableaux. Analysons filter(), map() et réduire() et les conditions dans lesquelles ils doivent être utilisés.

Array.filter()

Il crée un nouveau tableau avec tous les éléments qui réussissent le test implémenté par la fonction fournie. Il appelle la fonction de rappel fournie une fois pour chaque élément d'un tableau et renvoie un nouveau tableau de toutes les valeurs pour lesquelles la fonction de rappel renvoie vrai.

Syntaxe

filter(callbackFn)
filter(callbackFn, thisArg)

Il est évalué comme suit : Array.filter((element, index, array) => { ... } )

Le callbackFn est une fonction à exécuter pour chaque élément du tableau qui doit renvoyer une valeur vraie pour conserver les éléments du tableau résultant et une valeur fausse dans le cas contraire. La fonction prend trois arguments : l'élément actuel, l'index et le tableau lui-même.

Dans l'exemple ci-dessous, étant donné un tableau de nombres et que l'on s'attend à ce qu'ils trouvent les nombres pairs, la méthode filter() serait utile comme indiqué :

const numbers = [1, 2, 3, 4, 5, 6];
const evenNumbers = numbers.filter(number => number % 2 === 0);
console.log(evenNumbers); // Output: [2, 4, 6]

Array.map()

La méthode map() crée un nouveau tableau qui est rempli avec les résultats de l'appel d'une fonction fournie sur chaque élément du tableau actuel. Il a invoqué la fonction de rappel uniquement pour les index de tableau ayant attribué des valeurs et non invoqués pour les emplacements vides.

Syntaxe

map(callbackFn)
map(callbackFn, thisArg)

Cela se traduit simplement par : Arrays.map((element, index, array) => { ... })

Le callbackFn est une fonction à exécuter pour chaque élément du tableau et la valeur de retour est ajoutée en tant qu'élément unique dans le nouveau tableau.
La fonction prend trois arguments : l'élément actuel, l'index et le tableau lui-même.

Étant donné un tableau de nombres et devant renvoyer leurs carrés, la méthode map() serait la plus efficace comme indiqué ci-dessous :

const numbers = [1, 2, 3, 4, 5];
const squareNumbers = numbers.map(number => number ** 2);
console.log(squareNumbers); // Output: [1, 4, 9, 16, 25]

Nous mappons les valeurs d'un tableau dans un autre.

Array.reduce()
La méthode réduire() exécute un réducteur de fonction de rappel sur chaque élément du tableau, par ordre d'index croissant, en transmettant la valeur de retour du calcul de l'élément précédent. Le résultat final de l’exécution du réducteur sur tous les éléments du tableau est une valeur unique.

Si une valeur initiale est fournie, elle sera utilisée comme premier argument lors du premier appel du rappel. Si aucune valeur initiale n'est fournie, le premier élément du tableau est utilisé comme valeur initiale, puis l'itération commencera à partir du deuxième élément.

Syntaxe

reduce(callbackFn)
reduce(callbackFn, initialValue)

Le callbackFn est une fonction à exécuter pour chaque élément du tableau. Sa valeur de retour devient la valeur du paramètre accumulateur lors du prochain appel du rappel. Lors du dernier appel, la valeur de retour devient la valeur de retour de la fonction réduire().
Il prend les arguments suivants : accumulateur, currentValue, currentIndex et tableau sur lequel il a été appelé.

En utilisant un tableau de nombres et en étant chargée de trouver leur somme, la méthode réduire() l'évaluerait facilement comme indiqué ci-dessous :

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum); // Output: 15

Conclusion
Ces méthodes filter(), map() et réduire() sont essentielles pour l'itération et la manipulation des tableaux.

• filter() est mieux utilisé pour rechercher tous les éléments d'un tableau donné qui répondent aux critères de la fonction de rappel.

• map() est une méthode de tableau non destructive mieux utilisée pour manipuler les données d'un tableau donné et attendre une valeur de retour.

• reduce() est utile pour agréger des éléments de tableau en une seule valeur basée sur une fonction de réduction.

Références

• Documents Web MDN sur Array.prototype.filter

• Documents Web MDN sur Array.prototype.map

• Documents Web MDN sur Array.prototype.reduce

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!