Array.fill(Array) creates copies by references not

Question

This question already has an answer here:

• Array.prototype.fill() with object passes reference and not new instance 5 answers

I'm trying to create a 6 by 12 Matrix using Array.fill

let m = Array(6).fill(Array(12).fill(0));

While this works, the problem is that the inner Arrays are actually all referencing the same Array object.

let m = Array(6).fill(Array(12).fill(0));
m[0][0] = 1;
console.log(m[1][0]); // Outputs 1 instead of 0

I wanted (and expected) the value of m[1][0] to be 0.

How can I force Array.fill fill copy-by-values of the given argument (eg: Array(12).fill(0) is the argument in my case) instead of copying by reference ?

Answer 1

You can't do it with .fill(), but you can use .map():

let m = new Array(6).map(function() { return new Array(12); });

edit oh wait that won't work; .map() won't iterate through the uninitialized elements. You could fill it first:

let m = new Array(6).fill(null).map(function() { return new Array(12); });

Answer 2

You can't do it with Array#fill method. Instead iterate over the array and add newly created array using a for loop.

let m = Array(6);
for (var i = 0; i < m.length; i++)
  m[i] = Array(12).fill(0)

m[0][0] = 1;
console.log(m[1][0]);

Answer 3

You could use Array.from() instead:

Thanks to Pranav C Balan in the comments for the suggestion on further improving this.

let m = Array.from({length: 6}, e => Array(12).fill(0));

m[0][0] = 1;
console.log(m[0][0]); // Expecting 1
console.log(m[0][1]); // Expecting 0
console.log(m[1][0]); // Expecting 0

---

Original Statement (Better optimized above):

let m = Array.from({length: 6}, e => Array.from({length: 12}, e => 0));