support@90-10.dev

JavaScript Map & WeakMap

The Map and WeekMap objects are built-in JavaScript data structures that allow you to store key-value pairs, where each key can be of any type, including objects, and each value can be of any type or a combination of types.

Map objects maintain the order in which key-value pairs are added, whereas object property order is not guaranteed.

Map

The Map object can be created using the following syntax:

const myMap = new Map();

We can also initialise a Map object with an iterable, such as an array of arrays containing key-value pairs:

const myMap = new Map([
  ['key1', 'value1'],
  ['key2', 'value2'],
  ['key3', 'value3']
]);

console.log(myMap); 
  // prints: Map(3) { key1 → "value1", key2 → "value2", key3 → "value3" }

New keys can be set using the set method, retrieves using the get method and deleted using the delete method. Also, their presence can be checked with the has method.

const myMap = new Map();

const key1 = { name: 'key 1'};
myMap.set(key1, 'value1');

console.log(myMap);            // prints: Map { {…} → "value1" }
console.log(myMap.get(key1));  // prints: value1

console.log(myMap.has(key1));  // prints: true

myMap.delete('random');        // prints: false
myMap.delete(key1);            // prints: true

Map objects have additional methods such as size:

const myMap = new Map();

const key1 = { name: 'key 1'};
myMap.set(key1, 'value1');

console.log(myMap.size);       // prints: 1

Iteration

We can iterate over the keys of a Map object using the keys() method - it returns a new iterator object that contains the keys in insertion order.

const myMap = new Map([
  ['key1', 'value1'],
  ['key2', 'value2'],
  ['key3', 'value3']
]);

for (const key of myMap.keys()) {
  console.log(key);
}

Similarly, there is a values() iterator and they can be converted to arrays:

const keys = Array.from(myMap.keys());
const values = Array.from(myMap.values());

Memory usage

The Map object can use any type of value as a key, whereas object keys are always converted to strings. This flexibility can also lead to increased memory usage, since Map objects can potentially contain a large number of objects as keys.


WeakMap

The WeakMap object is similar to the Map object, but with some differences:

No Primitive Keys

WeakMap keys must be objects, with primitive values such as numbers or strings are not allowed.

Weakly Held Objects

When a WeakMap object is created, memory is allocated to store the object and its key-value pairs. Unlike a regular Map object, the keys of a WeakMap object are not strongly held. This means that if there are no other references to a key in the program, the key may be garbage collected by the JavaScript engine. When a key is garbage collected, its associated value is also removed from the WeakMap object.

Other Limitations

WeakMap objects do not have a size property or any other way to get the number of key-value pairs they contain.

Moreover, keys cannot be iterated directly - there is no keys() iterator. This is a side effect of keys being garbage collected at any time, so there is no guarantee that the keys returned by an iterator will still be valid.

Therefore, WeakMap objects are not enumerable - we cannot use a for...in loop or keys() to iterate over properties.