ES6 - Cartes et décors

ES6 introduit deux nouvelles structures de données - maps et sets. Apprenons-les en détail.

Plans

Une carte est une collection ordonnée de key-value pairs. Les cartes sont similaires aux objets. Cependant, il existe certaines différences entre les cartes et les objets. Ceux-ci sont énumérés ci-dessous -

Sr.Non	Objet	Carte
1	Les clés ne peuvent pas être de type objet	Les clés peuvent être de n'importe quel type
2	Les clés ne sont pas commandées	Les clés sont commandées
3	non itérable	itérable

Syntaxe

La syntaxe de Map est donnée ci-dessous -

let map = new Map([iterable])
let map = new Map()

Exemple

L'exemple suivant crée une carte à l'aide d'un constructeur itérable -

<script>
   let andy = {ename:"Andrel"},
      varun = {ename:"Varun"},
      prijin = {ename:"Prijin"}
   let empJobs = new Map([
   [andy,'Software Architect'],
   [varun,'Developer']]
   );
   console.log(empJobs)
</script>

La sortie du code ci-dessus est comme indiqué ci-dessous -

{{…} => "Software Architect", {…} => "Developer"}

Vérification de la taille de la carte

La propriété size peut être utilisée pour déterminer le nombre de valeurs stockées dans la carte.

Syntaxe

La syntaxe pour vérifier la taille de la carte est donnée ci-dessous -

map_name.size

Exemple

<script>
   let daysMap = new Map();
   daysMap.set('1', 'Monday');
   daysMap.set('2', 'Tuesday');
   daysMap.set('3', 'Wednesday');
   console.log(daysMap.size);
</script>

La sortie du code ci-dessus est comme indiqué ci-dessous -

3

Voici quelques méthodes courantes qui peuvent être utilisées pour manipuler des cartes -

Sr.Non	Objet et carte
1	set (clé, valeur) Ajoute une clé et une valeur à la carte
2	Obtenir la clé) Renvoie la valeur si la clé correspond
3	a (clé) Renvoie true si un élément avec la clé spécifiée existe; else renvoie false
4	clés() Renvoie un itérateur contenant les clés de chaque élément de l'objet map
5	valeurs() Renvoie un itérateur contenant les valeurs de chaque élément de l'objet cartographique
6	entrées () Renvoie un itérateur qui contient les paires clé-valeur pour chaque élément de la carte
sept	supprimer (clé) Supprime l'élément spécifié d'un objet Map

WeakMap

WeakMap est un petit subset of map. Les clés sont faiblement référencées, elles ne peuvent donc être que non primitives. S'il n'y a pas de référence aux clés d'objet, il sera soumis au garbage collection.

• non itérable
• chaque clé est de type objet

Le WeakMap autorisera le garbage collection si la clé n'a pas de référence.

Syntaxe

La syntaxe de WeakMap est indiquée ci-dessous -

new WeakMap([iterable])

Exemple 1

<script>
   let emp = new WeakMap();
   emp.set(10,'Sachin');// TypeError as keys should be object
</script>

Exemple 2

<script>
   let empMap = new WeakMap();
   // emp.set(10,'Sachin');// Error as keys should be object
   let e1= {ename:'Kiran'},
      e2 = {ename:'Kannan'},
      e3 = {ename:'Mohtashim'}

   empMap.set(e1,1001);
   empMap.set(e2,1002);
   empMap.set(e3,1003);

   console.log(empMap)
   console.log(empMap.get(e2))
   console.log(empMap.has(e2))
   empMap.delete(e1)
   console.log(empMap)
</script>

La sortie du code ci-dessus est comme mentionné ci-dessous -

{{…} => 1002, {…} => 1003, {…} => 1001}
1002
true
{{…} => 1002, {…} => 1003}

Ensemble

Un ensemble est une collection non ordonnée de valeurs uniques. Cette structure de données peut contenir des valeurs de types primitifs et objets.

Syntaxe

La syntaxe de Set est donnée ci-dessous -

new Set([iterable])
new Set()

Exemple

<script>
   let names = new Set(['A','B','C','D']);
   console.log(names)
</script>

La sortie du code ci-dessus est comme indiqué ci-dessous -

{"A", "B", "C", "D"}

Vérification de la taille d'un ensemble

La propriété size de l'objet Set peut être utilisée pour interroger le nombre d'éléments dans l'ensemble.

Syntaxe

La syntaxe pour vérifier la taille d'un ensemble est mentionnée ci-dessous -

set.size

Exemple

<script>
   let names = new Set(['A','B','C','D']);
   console.log(names.size)
</script>

La sortie du code ci-dessus est comme indiqué ci-dessous -

4

Itérer un ensemble

Nous pouvons utiliser le forEach et for..ofboucles pour parcourir un ensemble. Ceci est illustré dans l'exemple ci-dessous -

Exemple

<script>
   let names= new Set(['A','B','C','D']);
   //iterate using forEach
   console.log('forEach')
   names.forEach(n=>console.log(n))
   
   console.log('for of..')
   
   //iterate using for..of
   for(let n of names){
      console.log(n)
   }
</script>

La sortie du code ci-dessus est comme mentionné ci-dessous -

forEach
A
B
C
D
for of..
A
B
C
D

Les méthodes suivantes peuvent être utilisées pour manipuler un ensemble -

Sr.Non	Objet et carte
1	ajouter (élément) Ajoute un élément à l'ensemble
2	has (élément) Renvoie vrai si l'élément trouvé; else renvoie false
3	supprimer (élément) Supprimer un élément spécifique de l'ensemble
4	clair() Efface tous les éléments de l'ensemble

WeakSet

Un Weakset contient des objets faiblement, ce qui signifie que les objets stockés dans un WeakSet sont soumis au garbage collection s'ils ne sont pas référencés. Les WeakSets ne sont pas itérables et n'ont pasget méthode.

<script>

   let e1 = {ename:'A'}
   let e2 ={ename:'B'}
   let e3 ={ename:'C'}

   let emps = new WeakSet();
   emps.add(e1);
   emps.add(e2)
   .add(e3);

   console.log(emps)
   console.log(emps.has(e1))
   emps.delete(e1);
   console.log(emps)
</script>

La sortie du code ci-dessus sera comme mentionné ci-dessous -

WeakSet {{…}, {…}, {…}}
true
WeakSet {{…}, {…}}