ES6 Data Structure Map

Posted By : Manisha Kirodiwal | 30-Jul-2018

Maps in ES6
Using
new Map (iterable) you can create a new map. This iterable data can be any iterable object or an array but elements should be should be in key / value pairs.

var a = new Map()
a.set('x', 9)
a.set('z', 10)
// {"x” => 9, "z" => 10}

 

Map Methods and Properties
Using size property you can get
the size of the map. You should make sure to use .set property with the map so that size updates accordingly.

var a = new Map()
a.set('x', 9)
a.set('z', 10)
a.size; // 2  a; // Map(2) {"x” => 9, "z" => 10}
Clear the Map
Using map.clear() you can clear all the entries of the map
 
Delete a key
Using map.delete(key) you can delete a key and it returns true on successful deletion of the key.
 
var a = new Map()
a.set('x', 9)
a.set('z', 10)
a.delete(‘x’); // true
a.delete(‘z’); // false (key not present)

 

get(key) and has(key) method
You can use get method to receive the value for the key and using has method you can check is key present or not.
 
a.get(‘x’); // 1
a.has(‘x’); // true
a.has('d'); // false
 
forEach function
Using map.forEach(fn) loop you can iterate the map, it easily provide the control to the map keys and values of the map and the map itself.
 
 
var a = new Map()
a.set('x', 9)
a.set('z', 10)
a.forEach((r, t, y) => console.log(`key:${r} value:${t} map:${y}`))
// key:1 value:x map:[Map Object]
// key:2 value:z map:[Map Object]
 
For..of function
Using for..of loop also you can iterate the map,this method easily gives you the control
 
to the keys and values of the map.
 
 
for([objkey,objvalue] of a) 
  console.log(objkey + '=' + objvalue)
// x=9
// z=10
 
a.keys() method
 
a.keys() method return a iterator , using .next() method you can iterate the map keys one by one.
 
var a = new Map()
a.set('x', 9)
a.set('z', 10)
var iterator = a.keys()
iterator.next(); // Object {value: "x", done: false}
iterator.next(); // Object {value: "z", done: false}
iterator.next(); // Object {value: undefined, done: true}
 
Values() and Entries() method 
Using Values() method you can iterate value in the same fashion and using entries() you will receive the array of [key, value].
 
var iterator = a.values()
iterator.next(); // Object {value: 9, done: false}
iterator.next(); // Object {value: 10, done: false}
iterator.next(); // Object {value: undefined, done: true}
var iterator = a.entries()
iterator.next(); // Object {value: [""x, 9], done: false}
iterator.next(); // Object {value: ["z", 10], done: false}
iterator.next(); // Object {value: undefined, done: true}
 
 
Maps give you many methods and properties to control on the operations that you you want to be performed on the keys, values, or the map.

 

 

 

 

About Author

Author Image
Manisha Kirodiwal

Manisha is a Web Application developer and she is good in working with Angular, TypeScript , JavaScript and Jquery. In free time she loves to dance and cooking.

Request for Proposal

Name is required

Comment is required

Sending message..