[SOLVED] Pushing to one element in a nested array is adding to all elements in javascript

Pushing to one element in a nested array is adding to all elements in javascript

I am creating a prefilled nested array and want to push elements to specific indexes, but the elements are being added to all indexes.

let arr = new Array(4).fill([])
arr => Array(4) [ [], [], [], [] ] //this is what I want
arr[0].push(3)
arr => Array(4) [ [3], [3], [3], [3] ] //I only wanted to push 3 to first index,
//why do all indexes have this element?

Any help on how to just update one index would be appreciated.

Solution

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

This is creating arr as an array of four references to the same array ([] passed as argument). Thus, modifying any of the references modifies the underlying array, and since it's referenced by all of them, you will notice this when logging the object.

> arr[0] === arr[1]
< true

Just use a good ol' for, or even simply [[],[],[],[]] if we are just talking about 4 elements.

let arr = new Array(4)

for (let i = 0; i < arr.length; i++)
    arr[i] = new Array()

> arr[0] === arr[1]
< false