Navigating with ES6 Maps and WeakMaps
“Map”as the term defines it, is a way of displaying relationship between elements. The traditional map helps us get around because it follows a reference to a static location. Latitudes and Longitudes correspond to any particular place on the map.
Let’s dive further into what ES6 Maps really are !!
Maps keep a collection of key , value pairs. They are iterable and hence we can loop through the pairs. It’s also possible to retrieve the size of the collection. Some methods which Maps have are :
# set - To add new pairs, <map_object>.set(key,value) method.
# get - To fetch the value of key, <map_object>.get(key) method.
# delete - To remove any pair, <map_object>.delete(key) method.
# has - verify if key exists, <map_object>.has(key) method.
# size - To check the length, <map_object>.size method.
# clear - To clear a mapobject,<map_object>.clear() method.
Below code snippet shows how the methods are used.
Let’s now try something else. What happens if we use the same key again to set a new value?
Yes, you’re right the previous key index gets overwritten with the new key index, and hence shows the size of the map as “1” thereby confirming that Map holds a “unique” collection set.
Are there any restrictions on which key or value type it can have?
Let’s try it out below:
Voila ! ES6 Maps gives flexibility here...to even have function as key. Every element pair I have set to the Map here is actually stored as part of the collection.
The main purpose of Map is to hold values in pairs for easy retrieval. So more than sequential ordering, the ability to extract faster is what matters here more.
WeakMaps
Browsing through many articles, made me wonder, why did WeakMaps get such a name — it could be probably because they hold “weak” references to key objects and they are weak in rendering out more of its details. We will deal more of this later.
For now let’s discuss the basic abilities of WeakMaps.
The first and foremost thing to note in WeakMaps is the fact that-
WeakMap key must be an object, nothing else allowed !
So if we try doing it, we clearly get the error -
“TypeError: WeakMap key must be an object”
WeakMaps follow Maps in how set, get, delete and has methods are used.
# set - To add new pairs. <wm_object>.set(key, value) method.
# get - To fetch value of key object, <wm_object>.get(key) method.
# delete - To remove any key, <wm_object>.delete(key) method.
# has - To check if key exists, <wm_object>.has(key) method.
But WeakMaps don’t have clear() method.
Neither can we check the size or length of the WeakMap collection. It returns undefined if we try to do so.
The next, important thing to remember is that WeakMaps unlike Maps are not enumerable. So looping does not work here and so there is no way we can get a list of keys easily here. The error we get is :
Why then, do we need WeakMaps, if it has restricted usage?
Designing WeakMaps this way enabled one thing —
Efficient Garbage Collection !
So if any object key is deleted from WeakMap, what happens is, JavaScript helps to clear all contents referenced by that key automatically !! Cool Right? References to key objects are held “weakly”, meaning they do not prevent garbage collection in case none other references this object. This make it very useful when we want efficiency as prime factor.
It is also their property of weak-referencing that prevents the possibility of iteration.
This property of non-iterability and inability to clear the WeakMap or even check the size enhances security and further prevents data leaks !
Let’s now summarize what we read -
With that we come to the end of this article.
When I initially learnt about Maps and WeakMaps, I thought over why WeakMaps were ever designed this way that made it look useless.
But the more I learnt, I realized WeakMaps are actually “smarter” than Maps !
