ES6 - Collections

ES6 introduit deux nouvelles structures de données: les cartes et les ensembles.

  • Maps - Cette structure de données permet de mapper une clé sur une valeur.

  • Sets- Les ensembles sont similaires aux tableaux. Cependant, les ensembles n'encouragent pas les doublons.

Plans

L'objet Map est une simple paire clé / valeur. Les clés et les valeurs d'une carte peuvent être primitives ou objets.

Voici la syntaxe pour le même.

new Map([iterable])

Le paramètre iterable représente tout objet itérable dont les éléments comprennent une paire clé / valeur. Les cartes sont ordonnées, c'est-à-dire qu'elles parcourent les éléments dans l'ordre de leur insertion.

Propriétés de la carte

Sr.Non Propriété et description
1 Map.prototype.size

Cette propriété renvoie le nombre de paires clé / valeur dans l'objet Map.

Comprendre les opérations de base sur la carte

La fonction set () définit la valeur de la clé dans l'objet Map. La fonction set () prend deux paramètres à savoir, la clé et sa valeur. Cette fonction renvoie l'objet Map.

La fonction has () renvoie une valeur booléenne indiquant si la clé spécifiée se trouve dans l'objet Map. Cette fonction prend une clé comme paramètre.

var map = new Map(); 
map.set('name','Tutorial Point'); 
map.get('name'); // Tutorial point

L'exemple ci-dessus crée un objet de carte. La carte n'a qu'un seul élément. La clé d'élément est désignée parname. La clé est mappée à une valeurTutorial point.

Note- Les cartes font la distinction entre des valeurs similaires mais portent des types de données différents. En d'autres termes, uninteger key 1 est considéré comme différent d'un string key “1”. Prenons l'exemple suivant pour mieux comprendre ce concept

var map = new Map(); 
map.set(1,true); 
console.log(map.has("1")); //false 
map.set("1",true); 
console.log(map.has("1")); //true

Production

false 
true

le set()méthode est également chaînable. Prenons l'exemple suivant.

var roles = new Map(); 
roles.set('r1', 'User') 
.set('r2', 'Guest') 
.set('r3', 'Admin'); 
console.log(roles.has('r1'))

Production

True

L'exemple ci-dessus définit un objet de carte. L'exemple enchaîne la fonction set () pour définir la paire clé / valeur.

le get() La fonction est utilisée pour récupérer la valeur correspondant à la clé spécifiée.

Le constructeur Map peut également recevoir un tableau. De plus, map prend également en charge l'utilisation de l'opérateur d'étalement pour représenter un tableau.

Exemple

var roles = new Map([ 
   ['r1', 'User'], 
   ['r2', 'Guest'], 
   ['r3', 'Admin'], 
]);  
console.log(roles.get('r2'))

La sortie suivante s'affiche lors de l'exécution réussie du code ci-dessus.

Guest

Note - La fonction get () renvoie undefined si la clé spécifiée n'existe pas dans la carte.

L'ensemble () remplace la valeur de la clé, si elle existe déjà dans la carte. Prenons l'exemple suivant.

var roles = new Map([ 
   ['r1', 'User'], 
   ['r2', 'Guest'], 
   ['r3', 'Admin'], 
]);  
console.log(`value of key r1 before set(): ${roles.get('r1')}`) 
roles.set('r1','superUser') 
console.log(`value of key r1 after set(): ${roles.get('r1')}`)

La sortie suivante s'affiche lors de l'exécution réussie du code ci-dessus.

value of key r1 before set(): User 
value of key r1 after set(): superUser

Méthodes cartographiques

Sr.Non Méthode et description
1 Map.prototype.clear ()

Supprime toutes les paires clé / valeur de l'objet Map.
2 Map.prototype.delete (clé)

Supprime toute valeur associée à la clé et renvoie la valeur que Map.prototype.has (clé) aurait précédemment renvoyée.

Map.prototype.has (key) retournera false par la suite.
3 Map.prototype.entries ()

Renvoie un nouvel objet Iterator qui contient an array of [clé, valeur] pour chaque élément de l'objet Map dans l'ordre d'insertion.
4 Map.prototype.forEach (callbackFn [, thisArg])

Appels callbackFnune fois pour chaque paire clé-valeur présente dans l'objet Map, dans l'ordre d'insertion. Si un paramètre thisArg est fourni à forEach, il sera utilisé comme valeur «this» pour chaque rappel.
5 Map.prototype.keys ()

Renvoie un nouvel objet Iterator qui contient le keys pour chaque élément de l'objet Map dans l'ordre d'insertion.
6 Map.prototype.values ​​()

Renvoie un nouvel objet Iterator qui contient an array of [clé, valeur] pour chaque élément de l'objet Map dans l'ordre d'insertion.

Le pour… de Loop

L'exemple suivant illustre le parcours d'une carte à l'aide de la boucle for… of.

'use strict' 
var roles = new Map([ 
   ['r1', 'User'], 
   ['r2', 'Guest'], 
   ['r3', 'Admin'], 
]);
for(let r of roles.entries()) 
console.log(`${r[0]}: ${r[1]}`);

La sortie suivante s'affiche lors de l'exécution réussie du code ci-dessus.

r1: User 
r2: Guest 
r3: Admin

Cartes faibles

Une carte faible est identique à une carte avec les exceptions suivantes -

  • Ses clés doivent être des objets.

  • Les clés d'une carte faible peuvent être récupérées. Garbage collection est un processus d'effacement de la mémoire occupée par des objets non référencés dans un programme.

  • Une carte faible ne peut pas être itérée ou effacée.

Exemple: carte faible

'use strict' 
let weakMap = new WeakMap(); 
let obj = {}; 
console.log(weakMap.set(obj,"hello"));  
console.log(weakMap.has(obj));// true

La sortie suivante s'affiche lors de l'exécution réussie du code ci-dessus.

WeakMap {} 
true

Ensembles

Un ensemble est une structure de données ES6. Il est similaire à un tableau à l'exception du fait qu'il ne peut pas contenir de doublons. En d'autres termes, il vous permet de stocker des valeurs uniques. Les ensembles prennent en charge à la fois les valeurs primitives et les références d'objet.

Tout comme les cartes, les ensembles sont également ordonnés, c'est-à-dire que les éléments sont itérés dans leur ordre d'insertion. Un ensemble peut être initialisé à l'aide de la syntaxe suivante.

Définir les propriétés

Sr.Non Propriété et description
1 Set.prototype.size

Renvoie le nombre de valeurs dans l'objet Set.

Définir les méthodes

Sr.Non Méthode et description
1 Set.prototype.add (valeur)

Ajoute un nouvel élément avec la valeur donnée à l'objet Set. Renvoie l'objet Set.
2 Set.prototype.clear ()

Supprime tous les éléments de l'objet Set.
3 Set.prototype.delete (valeur)

Supprime l'élément associé à la valeur.
4 Set.prototype.entries ()

Renvoie un nouvel objet Iterator qui contient an array of[valeur, valeur] pour chaque élément de l'objet Set, dans l'ordre d'insertion. Cela reste similaire à l'objet Map, de sorte que chaque entrée a la même valeur pour sa clé et sa valeur ici.
5 Set.prototype.forEach (callbackFn [, thisArg])

Appels callbackFnune fois pour chaque valeur présente dans l'objet Set, dans l'ordre d'insertion. SiathisArg est fourni à forEach, il sera utilisé comme valeur «this» pour chaque rappel.
6 Set.prototype.has (valeur)

Renvoie une valeur booléenne indiquant si un élément est présent avec la valeur donnée dans l'objet Set ou non.
sept Set.prototype.values ​​()

Renvoie un nouvel objet Iterator qui contient le values pour chaque élément de l'objet Set dans l'ordre d'insertion.

Ensemble faible

Les ensembles faibles ne peuvent contenir que des objets et les objets qu'ils contiennent peuvent être récupérés. Comme les cartes faibles, les ensembles faibles ne peuvent pas être itérés.

Exemple: utilisation d'un ensemble faible

'use strict' 
   let weakSet = new WeakSet();  
   let obj = {msg:"hello"}; 
   weakSet.add(obj); 
   console.log(weakSet.has(obj)); 
   weakSet.delete(obj); 
   console.log(weakSet.has(obj));

La sortie suivante s'affiche lors de l'exécution réussie du code ci-dessus.

true 
false

Itérateur

Iterator est un objet qui permet d'accéder un à un à une collection d'objets. L'ensemble et la carte ont des méthodes qui retournent un itérateur.

Les itérateurs sont des objets avec next()méthode. Lorsque la méthode next () est appelée, elle renvoie un objet avec'value' et 'done'Propriétés . 'done' est booléen, cela retournera true après avoir lu tous les éléments de la collection

Exemple 1: ensemble et itérateur

var  set = new Set(['a','b','c','d','e']);  
var iterator = set.entries(); 
console.log(iterator.next())

La sortie suivante s'affiche lors de l'exécution réussie du code ci-dessus.

{ value: [ 'a', 'a' ], done: false }

Étant donné que l'ensemble ne stocke pas de clé / valeur, le tableau de valeurs contient une clé et une valeur similaires. done sera faux car il y a plus d'éléments à lire.

Exemple 2: ensemble et itérateur

var  set = new Set(['a','b','c','d','e']);  
var iterator = set.values(); 
console.log(iterator.next());

La sortie suivante s'affiche lors de l'exécution réussie du code ci-dessus.

{ value: 'a', done: false }

Exemple 3: ensemble et itérateur

var  set = new Set(['a','b','c','d','e']);  
var iterator = set.keys(); 
console.log(iterator.next());

La sortie suivante s'affiche lors de l'exécution réussie du code ci-dessus.

{ value: 'a', done: false }

Exemple 4: carte et itérateur

var map = new Map([[1,'one'],[2,'two'],[3,'three']]); 
var iterator = map.entries(); 
console.log(iterator.next());

La sortie suivante s'affiche lors de l'exécution réussie du code ci-dessus.

{ value: [ 1, 'one' ], done: false }

Exemple 5: carte et itérateur

var map = new Map([[1,'one'],[2,'two'],[3,'three']]); 
var iterator = map.values(); 
console.log(iterator.next());

La sortie suivante s'affiche lors de l'exécution réussie du code ci-dessus.

{value: "one", done: false}

Exemple 6: carte et itérateur

var map = new Map([[1,'one'],[2,'two'],[3,'three']]); 
var iterator = map.keys(); 
console.log(iterator.next());

La sortie suivante s'affiche lors de l'exécution réussie du code ci-dessus.

{value: 1, done: false}