map

Estimated reading time: 6 minutes

Map is collection of data as key value pairs.

~ map methods ~ A JavaScript “Set” object can store only keys but “Map” can store key and value pairs.

  • size (properies)
  • clear
  • delete
  • entries
  • forEach
  • get
  • set
  • has
  • keys
  • values

Map is a collection of keyed data items, just like an Object. But the main difference is that Map allows keys of any type.

The main methods are:

  new Map()  creates the map.
  map.set(key, value)  stores the value by the key.
  map.get(key)  returns the value by the key, undefined if key doesnt exist in map.
  map.has(key)  returns true if the key exists, false otherwise.
  map.delete(key)  removes the value by the key.
  map.clear()  clears the map
  map.size  returns the current element count.

when use map

  • Need to use a non-string value as a key
  • specific order

set

    let users = new Map()
    users.set('name','kamal');
    users.set('age',21);
    users.set('status','dev');
    console.log(users);
    console.log(users.get(54))

get

    let users = new Map()
    users.set('name','kamal');
    users.set('age',21);
    users.set('status','dev');
    console.log(users.get('name'));
    // kamal
let users = new Map([
  ['name','kamal'],
  ['age',21],
  ['phone',{
    home: 999,
    office: 121
  }]
])
console.log(users.get('phone').office);
// 121

has

    let users = new Map()
    users.set('name','kamal');
    users.set('age',21);
    users.set('status','dev');
    console.log(users.has('name'));
    // true

size

    let users = new Map()
    users.set('name','kamal');
    users.set('age',21);
    users.set('status','dev');
    console.log(users.size);
    // 3

clear

  <script type="text/javascript">
    let users = new Map()
    users.set('name','kamal');
    users.set('age',21);
    users.set('status','dev');
    let result = users.clear();
    console.log(users);
 //

delete

  <script type="text/javascript">
    // let users = new Map()
    // users.set('name','kamal');
    // users.set('age',21);
    // users.set('status','dev');
    // let result = users.delete('name');
    // console.log(users);
  </script>

keys

    let users = new Map()
    users.set('name','kamal');
    users.set('age',21);
    users.set('status','dev');
    console.log(users.keys());
    // {"name", "age", "status"}

values

     let users = new Map()
     users.set('name','kamal');
     users.set('age',21);
     users.set('status','dev');
     console.log(users.values());
    // {"kamal", 21, "dev"}

entries

     let users = new Map()
     users.set('name','kamal');
     users.set('age',21);
     users.set('status','dev');
     console.log(users.entries()); -->
    // {"name" => "kamal", "age" => 21, "status" => "dev"}

forEach

    let users = new Map()
    users.set('name','kamal');
    users.set('age',21);
    users.set('status','dev');

    users.forEach(t => {
      console.log(t);
    })
    // kamal
    // 21
    // dev

specific order

// with object
let data = {
  'name': 'kamal'
  '1': 'one'
}
console.log(data)

// with map
let data = new Map()
data.set('name','kamal')
data.set('1', 'one')
console.log(data.entries())

soureces

es, es6, js