Al intentar realizar un cambio en un solo elemento de la matriz agregándole una cadena, luego actualiza el resto de los elementos de la matriz con el mismo valor de cadena. En lugar de cambiar un solo elemento, actualizó el resto de la matriz con el mismo valor.

He tratado de encontrar una explicación de por qué más de un elemento de la matriz cambia sin un bucle, pero no parece posible sin .apply, ... o un bucle:

 let arrayFiller = Array(20).fill([]); let myArray= ['foo', 'foo', 'foo']; [].push.apply(myArray, arrayFiller); console.log(myArray); myArray[3][0] = 'bar'; console.log(myArray); // Outputs: [ 'foo', 'foo', 'foo', [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ] ]

Lo que esperaba:

 let arrayFiller = Array(20).fill([]); let myArray= ['foo', 'foo', 'foo']; [].push.apply(myArray, arrayFiller); console.log(myArray); myArray[3][0] = 'bar'; console.log(myArray); // Outputs: [ 'foo', 'foo', 'foo', [ 'bar' ], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [] ]

Por cierto, esto también funciona:

 let arrayFiller = Array(20).fill([]); let myArray= ['foo', 'foo', 'foo']; [].push.apply(myArray, arrayFiller); console.log(myArray); myArray[4][0] = 'bar'; // Changed from myArray[3][0] to myArray[4][0] console.log(myArray); // Outputs: [ 'foo', 'foo', 'foo', [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ], [ 'bar' ] ]