Objet Map TypeScript

L'objet Map conserve des paires clé-valeur et mémorise l'ordre d'insertion d'origine des clés.

Toute valeur (objet ou valeur primitive) peut être utilisée comme clé ou comme valeur.

Map est une nouvelle structure de données introduite dans ES6. Vous pouvez vous référer àES6 Map and Set。


Créer une Map

TypeScript utilise le type Map et le mot-clé new pour créer une Map :

let myMap = new Map();

Pour initialiser une Map, vous pouvez passer des paires clé-valeur sous la forme d'un tableau :

let myMap = new Map([
        ["key1", "value1"],
        ["key2", "value2"]
    ]); 

Fonctions et propriétés liées à Map :

  • map.clear()– Supprime toutes les paires clé/valeur de l'objet Map.
  • map.set()– Définit une paire clé-valeur et renvoie cet objet Map.
  • map.get()– Renvoie la valeur correspondant à la clé, ou undefined si elle n'existe pas.
  • map.has()– Renvoie une valeur booléenne indiquant si la Map contient la valeur correspondant à la clé.
  • map.delete()– Supprime un élément de la Map, renvoie true en cas de succès et false en cas d'échec.
  • map.size– Renvoie le nombre de paires clé/valeur dans l'objet Map.
  • map.keys()- Renvoie un objet Iterator qui contient les clés de chaque élément de l'objet Map.
  • map.values()– Renvoie un nouvel objet Iterator qui contient les valeurs de chaque élément de l'objet Map.
  • map.entries()– Renvoie un itérateur qui contient toutes les paires clé-valeur dans la Map.

Fonctions courantes

set(key: K, value: V): this- Ajoute ou met à jour une paire clé-valeur dans la Map.

map.set('key1', 'value1');

get(key: K): V | undefined- Obtient la valeur en fonction de la clé, renvoie undefined si la clé n'existe pas.

const value = map.get('key1');

has(key: K): boolean - Vérifie si la clé spécifiée existe dans la Map.

const exists = map.has('key1');

delete(key: K): boolean - Supprime la paire clé-valeur pour la clé spécifiée, renvoie true si la suppression a réussi, sinon renvoie false.

const removed = map.delete('key1');

clear(): void - Efface toutes les paires clé-valeur de la Map.

map.clear();

size: number- Renvoie le nombre de paires clé-valeur dans la Map.

const size = map.size;

Méthodes d'itération

keys(): IterableIterator<K> - Renvoie un itérateur contenant toutes les clés de la Map.
for (const key of map.keys()) {
  console.log(key);
}

values(): IterableIterator<V>- Renvoie un itérateur contenant toutes les valeurs de la Map.

for (const value of map.values()) {
  console.log(value);
}

entries(): IterableIterator<[K, V]>- Renvoie un itérateur contenant toutes les paires clé-valeur de la Map, chaque élément est un tableau [key, value].

for (const [key, value] of map.entries()) {
  console.log(key, value);
}

forEach(callbackfn: (value: V, key: K, map: Map<K, V>) => void, thisArg?: any): void- Exécute la fonction de rappel fournie une fois pour chaque paire clé-valeur de la Map.

map.forEach((value, key) => {
  console.log(key, value);
});

Exemple

Exemple

const map = new Map<string, number>();

map.set('one', 1);
map.set('two', 2);

console.log(map.get('one')); // Sortie : 1

console.log(map.has('two')); // Sortie : true

map.delete('one');

console.log(map.size); // Sortie : 1

map.forEach((value, key) => {
  console.log(key, value); // Sortie : two 2
});

map.clear();

console.log(map.size); // Sortie : 0

Exemple - fichier test.ts

let nameSiteMapping = new Map(); //Définir l'objet Map nameSiteMapping.set("Google", 1); nameSiteMapping.set("Example", 2); nameSiteMapping.set("Taobao", 3); //Obtenir la valeur correspondant à la clé console.log(nameSiteMapping.get("Example")); // 2 //Déterminer si la Map contient une valeur correspondant à la clé console.log(nameSiteMapping.has("Taobao")); // true console.log(nameSiteMapping.has("Zhihu")); // false //Renvoie le nombre de paires clé/valeur dans l'objet Map console.log(nameSiteMapping.size); // 3 //Exemple de suppression console.log(nameSiteMapping.delete("Exemple")); // true console.log(nameSiteMapping); //Supprimer toutes les paires clé/valeur de l'objet Map nameSiteMapping.clear(); //Vider la Map console.log(nameSiteMapping);

Utiliseres6Compiler :

tsc --target es6 test.ts

Compilez le code ci-dessus pour obtenir le code JavaScript suivant :

Exemple - fichier test.js

let nameSiteMapping = new Map(); //Définir l'objet Map nameSiteMapping.set("Google", 1); nameSiteMapping.set("Example", 2); nameSiteMapping.set("Taobao", 3); //Obtenir la valeur correspondant à la clé console.log(nameSiteMapping.get("Example")); //40 //Déterminer si la Map contient une valeur correspondant à la clé console.log(nameSiteMapping.has("Taobao")); //true console.log(nameSiteMapping.has("Zhihu")); //false //Renvoie le nombre de paires clé/valeur dans l'objet Map console.log(nameSiteMapping.size); //3 //Exemple de suppression console.log(nameSiteMapping.delete("Exemple")); // true console.log(nameSiteMapping); //Supprimer toutes les paires clé/valeur de l'objet Map nameSiteMapping.clear(); //Vider la Map console.log(nameSiteMapping);

Exécutez le code JavaScript ci-dessus, le résultat de sortie est :

2
true
false
3
true
Map { 'Google' => 1, 'Taobao' => 3 }
Map {}

Itérer sur Map

Les éléments d'un objet Map sont insérés dans l'ordre. Nous pouvons parcourir l'objet Map, et chaque itération renvoie un tableau [clé, valeur].

TypeScript utilisefor...ofpour implémenter l'itération :

Exemple - fichier test.ts

let nameSiteMapping = new Map(); nameSiteMapping.set("Google", 1); nameSiteMapping.set("Example", 2); nameSiteMapping.set("Taobao", 3); //Itérer sur les clés dans la Map for (let key of nameSiteMapping.keys()) { console.log(key); } //Itérer sur les valeurs dans la Map for (let value of nameSiteMapping.values()) { console.log(value); } //Itérer sur la clé => valeur dans la Map for (let entry of nameSiteMapping.entries()) { console.log(entry[0], entry[1]); } //Utiliser la déstructuration d'objet for (let [key, value] of nameSiteMapping) { console.log(key, value); }

Utiliseres6Compiler :

tsc --target es6 test.ts

Compilez le code ci-dessus pour obtenir le code JavaScript suivant :

Exemple

let nameSiteMapping = new Map(); nameSiteMapping.set("Google", 1); nameSiteMapping.set("Example", 2); nameSiteMapping.set("Taobao", 3); //Itérer sur les clés dans la Map for (let key of nameSiteMapping.keys()) { console.log(key); } //Itérer sur les valeurs dans la Map for (let value of nameSiteMapping.values()) { console.log(value); } //Itérer sur la clé => valeur dans la Map for (let entry of nameSiteMapping.entries()) { console.log(entry[0], entry[1]); } //Utiliser la déstructuration d'objet for (let [key, value] of nameSiteMapping) { console.log(key, value); }

Exécutez le code JavaScript ci-dessus, le résultat de sortie est :

Google
Example
Taobao
1
2
3
Google 1
Example 2
Taobao 3
Google 1
Example 2
Taobao 3
Autres extensions