Les Maps

Une Map est une structure de données JavaScript qui permet d’associer une clé à une valeur.

Une Map fonctionne avec un système :

clé → valeur

Les Maps sont très utiles pour gérer :

• Des paniers
• Des inventaires
• Des compteurs
• Des statistiques
• Des données dynamiques

1. Créer une Map

Une Map se crée avec :

new Map()

const cart = new Map();

Ici, JavaScript crée une nouvelle Map vide.

2. Ajouter une valeur avec set()

La méthode set() ajoute une clé et une valeur.

const cart = new Map();

cart.set("apple", 3);

Ici :

• "apple" = clé
• 3 = valeur

3. Lire une valeur avec get()

La méthode get() retourne la valeur associée à une clé.

console.log(cart.get("apple"));

4. Vérifier une clé avec has()

La méthode has() vérifie si une clé existe.

console.log(cart.has("apple"));

5. Supprimer une valeur avec delete()

La méthode delete() supprime une clé.

cart.delete("apple");

Après cette opération, la clé n’existe plus dans la Map.

6. Vider une Map avec clear()

La méthode clear() supprime tout le contenu.

cart.clear();

La Map devient vide.

7. La propriété size

La propriété size retourne le nombre d’éléments dans une Map.

cart.set("apple", 3);

cart.set("banana", 2);

console.log(cart.size);

8. Parcourir une Map avec for...of

Une Map peut être parcourue avec :

for...of

for (const [item, quantity] of cart) {

    console.log(item);

    console.log(quantity);

}

Ici :

• item reçoit la clé
• quantity reçoit la valeur

9. entries()

La méthode entries() retourne les paires clé → valeur.

for (const [key, value] of cart.entries()) {

    console.log(key);

    console.log(value);

}

Une Map utilise automatiquement entries() lorsqu’on utilise for...of.

10. keys()

La méthode keys() retourne seulement les clés.

for (const key of cart.keys()) {

    console.log(key);

}

11. values()

La méthode values() retourne seulement les valeurs.

for (const value of cart.values()) {

    console.log(value);

}

12. forEach()

Une Map possède aussi la méthode :

forEach()

cart.forEach((quantity, item) => {

    console.log(item);

    console.log(quantity);

});

Attention : dans une Map, la valeur arrive avant la clé.

13. Map vs Object

14. Exemple concret : panier

const cart = new Map();

cart.set("apple", 2);

cart.set("banana", 1);

for (const [item, quantity] of cart) {

    console.log(`${quantity} ${item}`);

}

15. Pourquoi utiliser une Map

• Accès rapide aux valeurs
• Données dynamiques
• Facile à parcourir
• Très pratique avec les boucles
• Excellent pour les systèmes clé → valeur

16. Erreur fréquente

Une Map ne fonctionne pas comme un objet.

cart.apple = 3;

Bonne pratique : utiliser :

cart.set("apple", 3);

17. Bonnes pratiques

• Utiliser Map pour les données dynamiques
• Utiliser set() et get()
• Utiliser for...of pour parcourir les données
• Utiliser has() avant certaines opérations
• Choisir Map lorsque la logique fonctionne avec des clés

Résumé rapide