How to find the size of map in javascript

Question

I want to print the size of map in javascript. I used the command map.size but the answer is coming 0 which is not correct.

Here is my source code:

<div id="demo" ></div>
<script>
    function add(test, key, value) {
        if (!test[key]) 
            test[key] = [value];
        else 
            test[key].push(value);
    }
    var mapp = new Map();
    var i,j,k=0;
    for (i=0;i<5;i++)
    {
      for (j=0;j<i;j++)
      add(mapp,i,j);
    }
    document.getElementById('demo').innerHTML="Map size are: "+ mapp.size;
</script>

Output: Map size are: 0

However, when I am printing the map entries:

for (var m in mapp)
{
        for (k=0;k<mapp[m].length;k++)
        document.write(mapp[m][k]+"  ");

      document.write("<br>");
}

I can see the output:

0 
0 1 
0 1 2 
0 1 2 3 

Please tell me how to find the size of map and why the above code mapp.size is not working.

Answer 1

You are treating Map like an array and using [] to access key/value items of it. You need to use the actual methods of Map. Instead of [], use .get() and .set().

Right now, you are setting the actual properties of the Map which are not the same as the actual tracked iterable k/v items stored by the data structure.

// Incorrect
const m1 = new Map();

m1["foo"] = "bar";

console.log(m1.length); // undefined
console.log(m1.size); // 0

// Correct
const m2 = new Map();

m2.set("foo", "bar");

console.log(m2.length); // undefined
console.log(m2.size); // 1