La méthode Map
Fait partie de la section Logique & Flux du Journey JavaScript de Coddy — leçon 52 sur 65.
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. Elle transforme chaque élément et retourne un nouveau tableau de la même longueur.
Syntaxe de base :
let newArray = arr.map(function(currentValue, index, array) {
// retourne l'élément pour newArray
});Voici un exemple simple :
const numbers = [1, 2, 3, 4];
const doubled = numbers.map((num) => {
return num * 2;
});
console.log(doubled); // [2, 4, 6, 8]Voici le même exemple avec une syntaxe plus courte :
const numbers = [1, 2, 3, 4];
const doubled = numbers.map(num => num * 2);
console.log(doubled); // [2, 4, 6, 8]La méthode map() ne modifie pas le tableau d'origine. Elle retourne toujours un nouveau tableau.
Défi
FacileCréez une fonction appelée formatNames qui prend un tableau de noms (chaînes de caractères) en argument. La fonction doit utiliser la méthode map() pour transformer chaque nom de manière à ce qu'il soit en casse de titre (la première lettre de chaque mot en majuscule, le reste en minuscules). Retournez le nouveau tableau de noms formatés.
Aide-mémoire
La méthode map() crée un nouveau tableau en appelant une fonction sur chaque élément du tableau d'origine :
let newArray = arr.map(function(currentValue, index, array) {
// retourne l'élément pour newArray
});Exemple avec une fonction fléchée :
const numbers = [1, 2, 3, 4];
const doubled = numbers.map(num => num * 2);
console.log(doubled); // [2, 4, 6, 8]La méthode map() ne modifie pas le tableau d'origine et retourne toujours un nouveau tableau de la même longueur.
Essayez vous-même
function formatNames(names) {
return names.map(name => {
// Écrivez votre code ici
})
}
Testez-vousCette 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 livres
Recherche par titreFiltrer par genreMarquer comme lu2Tableaux 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 JSON