JavaScript修改二维数组单个值却改动整行问题求助

问题原因 #

该问题是Array.fill()方法的特性导致的：

• 当fill()传入的参数为引用类型值（数组、对象等）时，JS不会为数组的每一项单独生成该值的独立副本，而是会把同一个值的内存引用批量赋值给数组的所有位置。

你写的new Array(10).fill(new Array(10).fill(1))代码实际执行逻辑如下：

1. 首先执行new Array(10).fill(1)，生成一个长度为10、所有值为1的数组，我们暂且称它为row
2. 外层数组执行fill(row)时，会把row的内存引用直接赋值给外层数组的10个元素，也就是说arr[0]、arr[1]...arr[9]全部指向同一个row数组的内存地址
3. 此时修改arr[1][1]本质是修改了共享的row数组的第1位，所有指向这个row的外层元素自然会同步变更，所以你打印任意行的第1位都会得到0。

正确的二维数组初始化写法 #

要避免引用共享问题，你需要为外层数组的每一项单独创建独立的子数组，推荐两种写法：

// 方法1：用Array.from实现
let arr = Array.from({length:10}, () => new Array(10).fill(1))

// 方法2：用循环逐行创建
let arr = []
for(let i=0; i<10; i++) {
  arr.push(new Array(10).fill(1))
}

以上两种写法都会为每一行生成独立的数组实例，修改单个坐标的值不会影响其他行。

内容的提问来源于stack exchange，提问作者Decod621