Array.prototype.fill()生成二维数组问题

本文探讨了使用Array.prototype.fill()生成二维数组时遇到的问题,即所有子数组共享同一引用。通过MDN了解到填充的是对象的引用。为解决此问题,文章提出使用Array.prototype.map()的方法,但发现当数组元素未赋值时,map不会调用。最后,文章提供了初始化赋值为null和使用Array.prototype.keys()结合扩展运算符的优化方案。

我打算使用Array.prototype.fill()快速生成二维数组,代码如下

let p = new Array(10).fill(new Array(5).fill(0))

预期生成10 * 5的二维数组
但是,当我们操作数组时,会发现出现了问题,以下代码使得所有p[i][0]都变为了10,这说明填充的数组都指向同一个引用。

p[0][0] = 10

查阅MDN,得知填充的是数组的引用。

If the first parameter is an object, each slot in the array will reference that object.

解决
为了解决以上问题,我们尝试使用Array.prototype.map()方法

let p = new Array(10).map(() => new Array(5).fill(0))

控制台打印p,发现他是一个包含了10个empty items的一维数组,说明map失败。

Array.map的callback只会针对已经赋值过的item进行调用(包括undefined)。
所以当有的元素被删除了,或者从来没有被赋值的时候,callback不会调用这个元素。

map calls a provided callbackFn function once for each element in an array, in order, and constructs a new array from the results. callbackFn is invoked only for indexes of the array which have assigned values (including undefined).

优化: 初始化时

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值