使用fill方法创建的数组无法修改单个值？多维数组创建方式是否有误

兄弟，你踩的这个坑太典型了——用Array.fill()直接创建多维数组确实是不正确的，核心原因和JavaScript里引用类型的存储机制有关。

当你写Array(n).fill([])这种代码时，fill方法会把同一个空数组的引用填充到新数组的每一个位置里。也就是说，数组里的每一项其实都是指向同一个内存地址的数组，不是各自独立的新数组。所以你修改任何一个位置的嵌套数组（比如arr[0][0] = 1），其他所有位置的嵌套数组都会跟着变——因为它们根本就是同一个东西！

举个错误写法的例子，一看就懂：

// 错误的多维数组创建方式
const wrongArr = Array(3).fill([]);
wrongArr[0][0] = 'hello';
console.log(wrongArr); 
// 输出：[ ['hello'], ['hello'], ['hello'] ]

那该怎么正确创建多维数组呢？给你几个靠谱的方法：

• 方法一：用Array.from生成独立嵌套数组
  Array.from可以接受一个映射函数，每一次迭代都会生成一个新的空数组，完美避免引用共享：

const correctArr1 = Array.from({ length: 3 }, () => []);
correctArr1[0][0] = 'hello';
console.log(correctArr1); 
// 输出：[ ['hello'], [], [] ]

• 方法二：用map方法生成独立项
  先创建一个指定长度的数组，再通过map为每一项生成新数组（注意：空数组直接用map是有效的，因为map会跳过空槽但这里我们只是生成新数组）：

const correctArr2 = Array(3).map(() => []);
correctArr2[1][0] = 'world';
console.log(correctArr2); 
// 输出：[ [], ['world'], [] ]

• 方法三：手动循环创建（最直观）
  如果觉得上面的方法有点抽象，手动循环push新数组也是完全没问题的：

const correctArr3 = [];
for (let i = 0; i < 3; i++) {
  correctArr3.push([]);
}
correctArr3[2][0] = '!';
console.log(correctArr3); 
// 输出：[ [], [], ['!'] ]

最后总结一下：fill()只适合填充原始类型（字符串、数字、布尔值等），因为原始类型是按值传递的，不会出现共享引用的问题。但如果要创建包含数组、对象这类引用类型的多维数组，一定要确保每个嵌套项都是独立的实例，别再用fill()直接填充引用类型啦！

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