Cartes JavaScript

Une carte contient des paires clé-valeur où les clés peuvent être n’importe quel type de données.
Une carte se souvient de l’ordre d’insertion d’origine des clés.
Une carte a une propriété qui représente la taille de la carte.
Méthodes de carte
Méthode | Description |
---|---|
nouvelle carte() | Crée un nouvel objet Map |
ensemble() | Définit la valeur d’une clé dans une carte |
obtenir() | Obtient la valeur d’une clé dans une carte |
clair() | Supprime tous les éléments d’une carte |
supprimer() | Supprime un élément Map spécifié par une clé |
a() | Renvoie true si une clé existe dans une Map |
pour chaque() | Invoque un rappel pour chaque paire clé/valeur dans un Map |
entrées() | Renvoie un objet itérateur avec le [key, value] paires dans une carte |
clés() | Renvoie un objet itérateur avec les clés dans un Map |
valeurs() | Renvoie un objet itérateur des valeurs d’une Map |
Propriété | Description |
---|---|
taille | Renvoie le nombre d’éléments Map |
Comment créer une carte
Vous pouvez créer une carte JavaScript en :
- Passer un tableau à
new Map()
- Créer une carte et utiliser
Map.set()
nouvelle carte()
Vous pouvez créer une carte en passant un tableau au new Map()
constructeur:
Exemple
// Créer une carte
const fruits = nouvelle carte([
[“apples”, 500],
[“bananas”, 300],
[“oranges”, 200]
]);
Essayez-le vous-même »
Map.set()
Vous pouvez ajouter des éléments à une carte avec le set()
méthode:
Exemple
// Créer une carte
const fruits = new Map();
// Définir les valeurs de la carte
fruits.set(“pommes”, 500);
fruits.set(“bananes”, 300);
fruits.set(“oranges”, 200);
Essayez-le vous-même »
Le set()
peut également être utilisée pour modifier les valeurs Map existantes :
Map.get()
Le get()
méthode obtient la valeur d’une clé dans un Map :
Taille de la carte
Le size
La propriété renvoie le nombre d’éléments dans une Map :
Carte.delete()
Le delete()
supprime un élément Map :
Carte.clear()
Le clear()
supprime tous les éléments d’un Map :
Map.has()
Le has()
La méthode renvoie true si une clé existe dans une Map :
Les cartes sont des objets
typeof
renvoie l’objet :
instanceof
La carte renvoie vrai :
Objets JavaScript vs cartes
Différences entre les objets JavaScript et les cartes :
Objet | Carte |
---|---|
Pas directement itérable | Directement itérable |
Ne pas avoir de propriété de taille | Avoir une propriété de taille |
Les clés doivent être des chaînes (ou des symboles) | Les clés peuvent être n’importe quel type de données |
Les clés ne sont pas bien ordonnées | Les clés sont classées par insertion |
Avoir des clés par défaut | Ne pas avoir de clés par défaut |
Map.forEach()
Le forEach()
La méthode invoque un rappel pour chaque paire clé/valeur dans un Map :
Exemple
// Liste toutes les entrées
laisser texte = “” ;
fruits.forEach (fonction(valeur, clé) {
texte += clé + ‘ = ‘ + valeur ;
})
Essayez-le vous-même »
Map.entries()
Le entries()
renvoie un objet itérateur avec la [key,values] dans une carte :
Exemple
// Liste toutes les entrées
laisser texte = “” ;
for (const x of fruits.entries()) {
texte += x ;
}
Essayez-le vous-même »
Map.keys()
Le keys()
renvoie un objet itérateur avec les clés d’une Map :
Exemple
// Liste toutes les clés
laisser texte = “” ;
pour (const x de fruits.keys()) {
texte += x ;
}
Essayez-le vous-même »
Map.values()
Le values()
renvoie un objet itérateur avec les valeurs d’un Map :
Exemple
// Liste toutes les valeurs
laisser texte = “” ;
for (const x of fruits.values()) {
texte += x ;
}
Essayez-le vous-même »
Vous pouvez utiliser le values()
méthode pour additionner les valeurs dans un Map :
Exemple
// Somme de toutes les valeurs
soit total = 0 ;
for (const x of fruits.values()) {
somme += x ;
}
Essayez-le vous-même »
Objets en tant que clés
Pouvoir utiliser des objets comme clés est une fonctionnalité importante de Map.
Exemple
// Créer des objets
const pommes = {nom : ‘Pommes’} ;
const bananes = {nom : ‘Bananes’} ;
const oranges = {nom : ‘Oranges’} ;
// Créer une carte
const fruits = new Map();
// Ajouter de nouveaux éléments à la carte
fruits.set(pommes, 500);
fruits.set(bananes, 300);
fruits.set(oranges, 200);
Essayez-le vous-même »
N’oubliez pas : la clé est un objet (pommes), pas une chaîne (“pommes”) :
Prise en charge du navigateur
Les cartes JavaScript sont prises en charge dans tous les navigateurs, à l’exception d’Internet Explorer :
Chrome | Bord | Firefox | Safari | Opéra |
#Cartes #JavaScript