Array.fill()使用记录

项目中用到了二维数组, 遇到了一些问题, 记录一下:

1. 使用Array(10)创建的数组是一个只有长度的数组, 数组中储存的是empty, 不可循环遍历

想要遍历就需要数组中包含可遍历元素
于是填充数组用到了Array(10).fill(undefined)方法 fill文档
得到一个长度为10, 且每个元素都是undefined的数组

2. fill() 方法进行填充时, 如果传入引用类型, 则数组中所有元素指向 同一个对象

const arr1= [1, 2]
const arr = new Array(2).fill(arr1)
arr[0][0] = 0
console.log(arr) 
// 预期 [[0, 2], [1, 2]]
// 实际 [[0, 2], [0, 2]]

这样在我们操作二维数组的值的时候数据就会混乱
当我们想创建一个指定的二维数组时可以这么写

new Array.fill(undefined).map(()=> new Array(10).fill(undefined) )

上面代码利用map循环、返回新数组的特性创建了一个10*10的二维数组, 保证内部数组内存指向干净
没有深究更简单的方法, 如有请告知, 谢谢

---

2020/5/1 更

发现了一个创建指定长度可遍历数组的新方法

Array.apply(null, {length: 2) // [undefined, undefind]

apply的第二个参数可以接收类数组元素对象，即带有length属性的对象，apply会 展开 这个对象作为参数
传递给Array，等同于Array(undefined, undefined)
同理:

Array(...Array(20)) // 这种写法也能创建一个可遍历数组
// 突然想起来一个方法
Array.from({length: 20 }) // from方法返回一个类数组对象的浅拷贝数组实例, 返回值也是可遍历的

Array(...{length: 20}) // 报错: VM22846:1 Uncaught TypeError: Found non-callable @@iterator