12. Map | WeakMap | ES6 | JavaScript | Typescript

Map, WeakMap | ES6
JAGADEESH PATTA ( PJ )

Agenda
 Introduction
 Object vs Map
 Map Syntax
 Method on Map
 Live Examples
 WeakMap
 WeakMap syntax
 Methods on WeakMap
 Live Example

Introduction
 The map object holds the data as key-value pair.
 The value may be any object or primitive data values.
 A map object iterates its elements in insertion order.
 Using for…of loop we can get key, values as an array for each iteration.
 We can give NaN as key in map.

Object vs Map
 Object allows keys only either strings or symbols. But map can allow any
type of data like primitives, functions, objects, etc.
 We can get values from object by using object[“key”] or object.key. But to
get values from map by using map.get(“key”) method.
 Data in the object can be any order. But in map the order of the keys based
on insertion of the data to map.

Syntax
Syntax
let map = new Map();
Example
let employeeMap = new Map();

Methods on Map
Clear( )
Delete( key )
Entries( )
Get( key )
Has( key )
Keys( )
Values( )
Set( key, val )

Insert Data into Map
let employeeMap = new Map( );
employeeMap.set(“empId”, 46);
employeeMap.set(“name”, “Jagadeesh”);
employeeMap.set(“designation”, “SSE”);

Get Data from Map
 Using forEach
 Using for…of
 Manual approach

Get Data from Map(cont…)
forEach
var map = new Map( );
map.forEach( function( key, val ){
console.log( key + “ “ + val );
});

For…of
for( let [ key, val ] of map ) {
}

For…of ( cont…)
for( let key of map.keys( ) ) {
console.log( key );
}

For…of ( cont…)
for( let val of map.values( ) ) {
console.log( val );
}

For…of ( Cont…)
for( let [ key, val ] of map.entries( ) ) {
}

Manual
console.log( map.get( key ) ); OR
var keys = map.keys( );
for ( let index = 0; index < keys.length; index++ ){
console.log( map.get( keys[ index ] ) );
}

WeakMap
 The weakmap object holds the data as key-value pair.
 In weakmap the keys are weakly referenced.
 The keys must be objects, and the values can be any values.
 We cannot get length of weakmap.
 Weakmap not allowed to get keys by keys() method.

Syntax
Syntax
let map = new WeakMap();
Example
let employeeMap = new WeakMap();

Methods on WeakMap
Delete( key )
Get( key )
Has( key )
Set( key, val )

WeakMap Example
let employeeMap = new WeakMap( );
var idObj = new Object( );
employeeMap.set( idObj, 46);
console.log( employeeMap.get( idObj ) );

12. Map | WeakMap | ES6 | JavaScript | Typescript

More Related Content

What's hot

Similar to 12. Map | WeakMap | ES6 | JavaScript | Typescript

More from pcnmtutorials

Recently uploaded

12. Map | WeakMap | ES6 | JavaScript | Typescript