javascript - Changing one cell in multidimensional array updates entire column

Question

When creating a new multidimensional array in Chrome's console like this:

var array = Array(10).fill(Array(10).fill(false));

the array looks as expected (inspect with console.table):

But when trying to change only one cell in the array: array[5][5] = true; something strange happens:

I have been banging my head against the wall for sometime because of this, but can't figure it out. Could this be a bug since Array.fill is an experimental/new feature?

Answer 1

It's because you actually only created two arrays. You created an inner array with 10 elements and then an outer array that has 10 elements, each of which reference the same inner array. When you change an element of the inner array and then look at the outer array, you'll see the same change in the inner array repeated 10 times.

Create your outer array with a loop instead so that a new inner array is created for every element of your outer loop.