Creating 2D arrays using new Array in Javascript [duplicate]

Answer 1

Because .fill() takes the argument and, if it's an object, it copies the reference to that object into every index of the new array. Since in fact [] is an object, your new array ends up being filled with references to the same array.

From the docs:

If the first parameter is an object, it will copy its reference and fill the array with references to that object.

Answer 2

Let me explain:

let count = new Array(4).fill([])

Here you create just 2 arrays actually. one is [] and second contains 4 links to [].

In other words you are creating an array of 4 links to the single instance of array.

--

let count = Array.from(Array(4), () => new Array());

Here you create 5 different arrays. 4 different empty [] and array that contains 4 links, one link to each unique [].

In other words here you create array filled with a different arrays

Answer 3

When you use Array(4).fill([]), you are actually filling count with only one array ([]). All the elements inside count refer to the same array. This is why when you alter the first element (which is also referenced by the second, third, and fourth element) and print count, count's elements all have the same array object. The same referencing scenario in fill happens to all objects, not just arrays.

Here, you can see that the second, third, and fourth element refers (denoted by /**ref:2**/) to the object with the same id (/**id:2**/) as the first element:

let count = new Array(4).fill([])
count[0].push("Test")
console.log(count)

Answer 4

        .fill([]) | New Array
       +----------+------+------+------+------+
       |          |      |      |      |      |
Memory |    []    |indx0 |indx1 |indx2 |indx3 |
       |          |      |      |      |      |
       +----------+------+------+------+------+
            ^        |      |      |      |   
            |        |      |      |      |   
            +--------+      |      |      |   
            +---------------+      |      |
            +----------------------+      |
            +-----------------------------+

The four indexes are pointing to the same value in memory, so when you're pushing an element, you're doing on the same value (array) in memory.