JS双重循环为二维数组赋值问题

Question

如下的代码，用两个for循环为二维数组赋值，为什么实际出来的结果跟预期不太一样。

let arr = new Array(2).fill(new Array(2));

for(let i = 0; i < 2; i++){
    for(let j = 0; j < 2; j++){
        arr[i][j] = ""+i+j;
    }
}

console.log(arr);    //实际结果：[ [ '10', '11' ], [ '10', '11' ] ]
                     //预期结果：[ [ '00', '01' ], [ '10', '11' ] ]

Answer 1

把代码展开就明白了

const item = new Array(2);
const arr = new Array(2).fill(item);
console.log(arr[0] === arr[1]);

所以，时刻都要清楚是在传址还是传值。

再补充一个等价例子

const item = {v: 1};
const arr = new Array(2).fill(item);
item.v = 5;
console.log(arr);

这两种写法从根本上来说是一样的，所以你的代码运行结果就是第二次循环的结果覆盖掉了第一次循环的结果而已。

Answer 2

补充一个，具体来说注意fill，如果填充的类型为对象，那么被赋值的是同一个内存地址的对象，而不是深拷贝对象。
https://es6.ruanyifeng.com/#d...