Apprendre Méthode Map() | Opérations Avancées sur les Tableaux

Cette section explorera plusieurs méthodes couramment utilisées pour travailler avec des tableaux en JavaScript. JS offre une grande variété de méthodes, mais nous nous concentrerons spécifiquement sur celles qui s'avèrent inestimables dans la programmation quotidienne : map(), filter(), find(), reduce(), et sort(). Ces méthodes sont choisies pour leur utilité pratique, répondant à des scénarios courants rencontrés dans les tâches de codage.

Pour une liste complète de toutes les méthodes de tableau, vous pouvez vous référer à la documentation MDN officielle.

map()

La méthode map() itère sur chaque élément du tableau original et applique une fonction de rappel spécifiée pour produire un nouveau tableau.

Voici la syntaxe de base :

array.map((element, index, array) => {
  // Callback body
});

element: C'est l'élément actuel en cours de traitement dans le tableau;
index: C'est l'index de l'élément actuel dans le tableau. Il représente la position de l'élément dans le tableau;
array: C'est le tableau sur lequel la méthode map() a été appelée. Il se réfère au tableau original en cours d'itération.

Illustrons 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}`);
});

Points clés à retenir sur map() :

Il itère sur le tableau original élément par élément ;
Il ne modifie pas le tableau original ;
Le résultat de la fonction de rappel est utilisé pour créer un nouveau tableau ;
Il renvoie un nouveau tableau de la même longueur.

Transformation des éléments du tableau

La méthode map() est idéale lorsque nous devons transformer chaque élément d'un tableau sans modifier le tableau original. Considérez 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

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 `strings.map((element) => (element += "!"))` ?

Tout était clair ?

Merci pour vos commentaires !

Section 5. Chapitre 1

Demandez à l'IA

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

Glissez pour afficher le menu

Pour une liste complète de toutes les méthodes de tableau, vous pouvez vous référer à la documentation MDN officielle.

map()

La méthode map() itère sur chaque élément du tableau original et applique une fonction de rappel spécifiée pour produire un nouveau tableau.

Voici la syntaxe de base :

array.map((element, index, array) => {
  // Callback body
});

element: C'est l'élément actuel en cours de traitement dans le tableau;
index: C'est l'index de l'élément actuel dans le tableau. Il représente la position de l'élément dans le tableau;
array: C'est le tableau sur lequel la méthode map() a été appelée. Il se réfère au tableau original en cours d'itération.

Illustrons 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}`);
});

Points clés à retenir sur map() :

Il itère sur le tableau original élément par élément ;
Il ne modifie pas le tableau original ;
Le résultat de la fonction de rappel est utilisé pour créer un nouveau tableau ;
Il renvoie un nouveau tableau de la même longueur.

Transformation des éléments du tableau

La méthode map() est idéale lorsque nous devons transformer chaque élément d'un tableau sans modifier le tableau original. Considérez 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

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 `strings.map((element) => (element += "!"))` ?

Tout était clair ?

Merci pour vos commentaires !

Section 5. Chapitre 1

Méthode Map()

map()

Points clés à retenir sur map() :

Transformation des éléments du tableau

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 strings.map((element) => (element += "!")) ?

Awesome!

Méthode Map()

map()

Points clés à retenir sur map() :

Transformation des éléments du tableau

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 strings.map((element) => (element += "!")) ?

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 `strings.map((element) => (element += "!"))` ?

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 `strings.map((element) => (element += "!"))` ?