Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Apprendre Transformation des Tableaux avec la Méthode map() | Méthodes Avancées de Tableaux et Transformations
Structures de Données JavaScript

bookTransformation des Tableaux avec la Méthode map()

Cette section explore plusieurs méthodes couramment utilisées pour manipuler les tableaux en JavaScript. JS propose une grande variété de méthodes, mais nous nous concentrerons spécifiquement sur celles qui s’avèrent indispensables dans la programmation quotidienne : map(), filter(), find(), reduce() et sort(). Ces méthodes sont sélectionnées pour leur utilité pratique, répondant à des situations fréquemment rencontrées lors des tâches de codage.

Pour une liste complète de toutes les méthodes de tableau, consultez la documentation MDN.

map()

La méthode map() parcourt chaque élément du tableau d’origine et applique une fonction de rappel spécifiée afin de produire un nouveau tableau.

Syntaxe de base :

array.map((element, index, array) => {
  // Callback body
});
  • element : Élément actuellement traité dans le tableau ;
  • index : Indice de l’élément courant dans le tableau. Il représente la position de l’élément dans le tableau ;
  • array : Tableau sur lequel la méthode map() a été appelée. Il fait référence au tableau d’origine parcouru.

Illustration de ce que représentent element, index et array :

12345
const products = ["Ball", "Shoes", "Mouse"]; const modifiedProducts = products.map((element, index, array) => { console.log(`Element: ${element}, Index: ${index}, Array: ${array}`); });
copy

Points clés à retenir concernant map() :

  • Parcours du tableau d'origine élément par élément ;
  • Ne modifie pas le tableau d'origine ;
  • Le résultat de la fonction de rappel est utilisé pour créer un nouveau tableau ;
  • Retourne un nouveau tableau de même longueur.

Transformation des éléments d'un tableau

La méthode map() est particulièrement utile lorsque chaque élément d'un tableau doit être transformé sans modifier le tableau d'origine. Considérer l'exemple suivant :

12345678910
const numbers = [3, 5, 11, 32, 87]; /* Use the `map` method to create a new array (`doubledNumbers`) by doubling each element of the `numbers` array. */ const doubledNumbers = numbers.map((element) => { return element * 2; }); console.log("Initial array:", numbers); // Output: 3, 5, 11, 32, 87 console.log("Modified array:", doubledNumbers); // Output: 6, 10, 22, 64, 174
copy

1. Que fait la méthode map() ?

2. Quelle est une caractéristique clé de la méthode map() ?

3. Dans l'exemple ci-dessous, que fait l'expression strings.map((element) => (element += "!")) ?

question mark

Que fait la méthode map() ?

Select the correct answer

question mark

Quelle est une caractéristique clé de la méthode map() ?

Select the correct answer

question mark

Dans l'exemple ci-dessous, que fait l'expression strings.map((element) => (element += "!")) ?

Select the correct answer

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 5. Chapitre 1

Demandez à l'IA

expand

Demandez à l'IA

ChatGPT

Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion

Awesome!

Completion rate improved to 2.27

bookTransformation des Tableaux avec la Méthode map()

Glissez pour afficher le menu

Cette section explore plusieurs méthodes couramment utilisées pour manipuler les tableaux en JavaScript. JS propose une grande variété de méthodes, mais nous nous concentrerons spécifiquement sur celles qui s’avèrent indispensables dans la programmation quotidienne : map(), filter(), find(), reduce() et sort(). Ces méthodes sont sélectionnées pour leur utilité pratique, répondant à des situations fréquemment rencontrées lors des tâches de codage.

Pour une liste complète de toutes les méthodes de tableau, consultez la documentation MDN.

map()

La méthode map() parcourt chaque élément du tableau d’origine et applique une fonction de rappel spécifiée afin de produire un nouveau tableau.

Syntaxe de base :

array.map((element, index, array) => {
  // Callback body
});
  • element : Élément actuellement traité dans le tableau ;
  • index : Indice de l’élément courant dans le tableau. Il représente la position de l’élément dans le tableau ;
  • array : Tableau sur lequel la méthode map() a été appelée. Il fait référence au tableau d’origine parcouru.

Illustration de ce que représentent element, index et array :

12345
const products = ["Ball", "Shoes", "Mouse"]; const modifiedProducts = products.map((element, index, array) => { console.log(`Element: ${element}, Index: ${index}, Array: ${array}`); });
copy

Points clés à retenir concernant map() :

  • Parcours du tableau d'origine élément par élément ;
  • Ne modifie pas le tableau d'origine ;
  • Le résultat de la fonction de rappel est utilisé pour créer un nouveau tableau ;
  • Retourne un nouveau tableau de même longueur.

Transformation des éléments d'un tableau

La méthode map() est particulièrement utile lorsque chaque élément d'un tableau doit être transformé sans modifier le tableau d'origine. Considérer l'exemple suivant :

12345678910
const numbers = [3, 5, 11, 32, 87]; /* Use the `map` method to create a new array (`doubledNumbers`) by doubling each element of the `numbers` array. */ const doubledNumbers = numbers.map((element) => { return element * 2; }); console.log("Initial array:", numbers); // Output: 3, 5, 11, 32, 87 console.log("Modified array:", doubledNumbers); // Output: 6, 10, 22, 64, 174
copy

1. Que fait la méthode map() ?

2. Quelle est une caractéristique clé de la méthode map() ?

3. Dans l'exemple ci-dessous, que fait l'expression strings.map((element) => (element += "!")) ?

question mark

Que fait la méthode map() ?

Select the correct answer

question mark

Quelle est une caractéristique clé de la méthode map() ?

Select the correct answer

question mark

Dans l'exemple ci-dessous, que fait l'expression strings.map((element) => (element += "!")) ?

Select the correct answer

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 5. Chapitre 1
some-alt