Chaînage des méthodes de tableaux
Fait partie de la section Logique & Flux du Journey JavaScript de Coddy — leçon 55 sur 65.
Le chaînage de tableaux vous permet d'effectuer plusieurs opérations sur un tableau en une seule instruction. Cette approche peut rendre votre code plus concis et lisible.
Voici un exemple de chaînage de méthodes de tableau :
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const result = numbers
.filter(num => num % 2 === 0)
.map(num => num * 2)
.reduce((sum, num) => sum + num, 0);
console.log(result); // 60Dans cet exemple, nous commençons avec un tableau de nombres, nous filtrons les nombres impairs, nous doublons chaque nombre restant, puis nous additionnons les résultats.
L'ordre du chaînage est important. Chaque méthode de la chaîne opère sur le résultat de la méthode précédente.
Défi
FacileCréez une fonction appelée processFruits qui prend un tableau d'objets de fruits. Chaque objet fruit possède les propriétés name (chaîne de caractères) et quantity (nombre).
La fonction doit utiliser des méthodes de tableau chaînées pour :
- Filtrer les fruits dont la quantité est 0
- Transformer chaque nom de fruit en majuscules
- Créer une chaîne de caractères qui liste tous les fruits avec leurs quantités comme "APPLE: 5, BANANA: 3"
Un petit rappel :
Vous pouvez utiliser la fonction .join(", ") pour convertir un tableau de chaînes de caractères en une seule chaîne.
Il est possible de chaîner même la fonction .join() :
arr.filter(...)
.map(...)
.join(...)Aide-mémoire
Le chaînage des méthodes de tableau vous permet d'effectuer plusieurs opérations sur un tableau en une seule instruction, ce qui rend le code plus concis et lisible.
Chaque méthode de la chaîne opère sur le résultat de la méthode précédente :
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const result = numbers
.filter(num => num % 2 === 0)
.map(num => num * 2)
.reduce((sum, num) => sum + num, 0);
console.log(result); // 60Vous pouvez également chaîner la méthode .join() pour convertir un tableau en une chaîne de caractères :
arr.filter(...)
.map(...)
.join(", ")Essayez vous-même
function processFruits(fruits) {
// Écrivez votre code ici
}
Cette leçon comprend un petit quiz. Commencez la leçon pour y répondre et suivre votre progression.
Toutes les leçons de Logique & Flux
1Les chaînes de caractères en profondeur
Fondamentaux des chaînesParcourir les chaînesTemplate LiteralsMéthodes des chaînesRécapitulatif - String Weaver4JSON Partie 2
Itérer sur du JSONJSON imbriquéChaînage optionnel JSONCopie superficielle et profondeRécapitulatif - Magasin de vélosRécapitulatif - Système solaire7Système de gestion de bibliothèque
Présentation du projetAjouter des livres2Tableaux multidimensionnels
Bases des tableaux 2DAccès aux éléments d'un tableau 2DBoucles imbriquées et tableaux 2DRécapitulatif - Tableaux 2DAddition et soustraction de matricesTableaux irréguliers (Jagged Arrays)Tableaux 3D et au-delàModèles courants de tableaux 2DRécapitulatif - Tout sur les tableaux3JSON Partie 1
Qu'est-ce qu'un JSON ?Vérifier si une clé existeMéthodes d'objetL'opérateur Spread Partie 1L'opérateur Spread Partie 2Supprimer des clésRécapitulatif - Manipuler les clés JSON6Ensembles - Partie 2
Math - Union d'ensemblesMath - Intersection d'ensemblesMath - Différence d'ensemblesMath - Différence symétriqueSous-ensembles et sur-ensemblesRécapitulatif - Grouper des amis9Méthodes avancées des tableaux
Les méthodes Join & SplitLa méthode MapLa méthode FilterLa méthode ReduceChaînage des méthodes de tableauxForEach et Map sont-elles identiques ?La méthode SortLes méthodes Find & FindIndexRécapitulatif - Le maître du chaînage