QNimate

  • CoursesVideos
  • WP PremiumPlugins
  • DemosLab
  • Home
  • QIdea
  • QTrack
Home Carbon Ads Difference between “Map” and “WeakMap” in JavaScript

Difference between “Map” and “WeakMap” in JavaScript

This post is a part 16 of ECMAScript 6 Complete Tutorial post series.

JavaScript “Map” and “WeakMap” objects allows you to store collection of unique keys and their corresponding values. But there are some key differences between them. Here are the differences:

  • They both behave differently when a object referenced by their keys/values gets deleted. Lets take the below example code:

    var map = new Map();
    var weakmap = new WeakMap();

    (function(){
        var a = {x: 12};
        var b = {y: 12};

        map.set(a, 1);
        weakmap.set(b, 2);
    })()

    One the above self invoked function is executed there is no way we can reference {x: 12} and {y: 12} anymore. Garbage collector goes ahead and deletes the key b pointer from “WeakMap” and also removes {y: 12} from memory. But in case of “Map”, the garbage collector doesn’t remove a pointer from “Map” and also doesn’t remove {x: 12} from memory.

    So “Map” can cause more garbages in memory. We can say that “Map” references are strong pointer whereas “WeakMap” references are weak pointers.

  • “WeakMap” keys cannot be primitive types. Nor they can be created by an 2D array.

    map.set(44, 12);

    //throws invalid type error
    weakmap.set(44, 13);

    //doesn't work. throws errors
    var map_1 = new WeakMap([[1, 2], [4, 5]]);
  • “WeakMap” doesn’t provide any methods or functions to work with the whole set of keys. For example: size, looping etc.

    console.log(weakmap.size); //undefined


    //loop through the keys in an map
    for(var i of map)
    {
        console.log(i);
    }

    //loop through the keys in an weakmap doesn't work
    for(var i of weakmap)
    {
        console.log(i);
    }

    //delete all keys
    map.clear();

    weakmap.clear(); //but this works
Feb 20, 2015Narayan Prusty
JavaScript "Map" ObjectJavaScript Promise vs Callback

Leave a Reply Cancel reply

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see http://daringfireball.net/projects/markdown/syntax

Narayan Prusty

I am a software engineer specialising in Blockchain, DevOps and Go/JavaScript. This is my personal blog where I write about things that I learn and feel interesting to share.

8 years ago Web Development
Share this
0
GooglePlus
0
Facebook
0
Twitter
0
Linkedin
Related Articles
  • Difference between Set and WeakSet in JavaScript
  • JavaScript “Map” Object
  • JavaScript Global Variables And Memory Leakage
  • JavaScript “Set” Object
  • JavaScript ArrayBuffers And Typed Arrays
Our Sponsor
My Books

2014 - 2015 © QNimate
All tutorials MIT license