七爪源码:如何在javascript中定义一个真正的二维数组

最近给京东2022秋招做了一道算法题。 问题需要输出的数据格式是二维数组。 但是我的回答在ac时有问题，二维数组的每个子数组中的值都是一样的。 当时一直卡在寻找二层for循环的bug，但是忽略了问题出在我定义二维数组的方式上，所以这里想讲一下如何定义一个真正的二- 维数组。

我们先看一个例子，网上最常用的定义二维数组的方法

const n =  3
 let arr =  new  Array(n). fill( new  Array(n). fill( 0));
 console. log(arr)
 copy code

看起来是对的，数组里面嵌套了三个数组，和我们想象的二维数组一样，但是问题就在这里。

看起来对吗？ 我们来做一个操作给二维数组中的元素赋值

arr[ 0][ 1] =  1;
 console. log( "after assignment", arr);
 copy code

我勒个去！什么情况下我只给二维数组的第0行第1列赋值1。为什么每个的第一列都变成1？

相信很多人第一次遇到这种情况时，都会有和我一样的疑惑。问题出在哪里？

问题在于 Array.fill()

不熟悉的朋友可以看看MDN上的简单解释

Array.prototype.fill()

我希望你会注意到这句话：“当一个对象被传递给 fill 方法时，数组被填充了对该对象的引用。 "

注意：如果填充的内容是'object'类型，那么对象分配了相同的内存地址，而不是深拷贝对象。

这就解释了上面的问题。我们根据它的内存地址找到了对象并修改了对象本身。这样，其他子数组也发生了变化，因为这些子数组都取自同一个内存地址。因此，上述方法定义的二维数组不能称为真正的二维数组（我这里说的对象其实就是js中的引用类型数据，array、object、map、Set，这些都是。 )

如何定义一个真正的二维数组？

其实很简单，两个for循环就可以完成

let arr1 =  new  Array(n);
 for ( let i =  0; i < n; i++) {
   for ( let j =  0; j < n; j++) {
    arr1[i] =  new  Array(n). fill( 0);
  }
}
 copy code

让我们给它赋值，看看之前和之后的结果

console. log( "before assignment", arr1);
arr1[ 0][ 1] =  1;
 console. log( "after assignment", arr1);
 copy code

没错，我们定义了一个真正的二维数组

希望大家以后在遇到二维数组问题的时候放弃第一种写法。 我们需要的是一个真正的二维数组。

关注七爪网，获取更多APP/小程序/网站源码资源！