如何在 JavaScript 中用初始值填充数组

1. 用基础数组填充数组

假设我们想用给定值初始化一个长度为3的数组
array.fill() 方法可以用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。
再结合使用 Array(n)

const length = 3
const filledArray = Array(length).fill(0)
filledArray;  // [0, 0, 0]

Array(length).fill(initialValue) 是一种创建具有所需长度并使用原始值（数字、字符串 、布尔值）初始化的数组的便捷方法。

1. 用对象填充数组

2.1 使用 array.fill()

const length = 3
const filledArray = Array(length).fill({ value: 0 })
filledArray  // [{value:0},{value:0},{value:0}]

Array(length).fill({ value: 0 }) 创建一个 length 数组为3，并为每项分配 {value: 0}，要注意的是：分配相同的对象实例
这种方法创建了一个具有相同对象实例的数组。如果修改数组中的任何一项，那么数组中的每一项都会受到影响：

const length = 3
const filledArray = Array(length).fill({ value: 0 })
filledArray  // [{value:0},{value:0},{value:0}]
filledArray[1].value = 3
filledArray  // [{value:3},{value:3},{value:3}]

改变数组的第二项filledArray[1].value=3会改变数组中的所有项。
解决方法 ：2.2 2.3
2.2 使用 array.from()
Array.from() 方法对一个数组或可迭代对象创建一个新的，浅拷贝的数组实例。
因此利用 Array,from() 方法可以轻松地创建和初始化具有不同对象实例的数组：

const length = 3
const filledArray = Array.from(Array(length), () => {
  return { value: 0 }
})
filledArray // [{value:0},{value:0},{value:0}]

如果修改数组中的任何项，则只有该项会受到影响，其他项不受影响：

const length = 3
const filledArray = Array.from(Array(length), () => {
  return { value: 0 }
})
filledArray // [{value:0},{value:0},{value:0}]
filledArray[1].value = 3
filledArray  // [{value:0},{value:3},{value:0}]

filledArray[1].value = 3 只修改数组的第二项。
2.3 使用 array.map() 结合 array.fill()
既然 Array(n) 返回一个数组，为何还需要使用 Array.from 呢，直接使用 map 不好吗，问题是 array.map() 跳过 empty 元素：

const length = 3
const filledArray = Array(length).map(() => {
  return { value: 0 }
})
filledArray  // [empty x 3]

解决方法很简单，将 empty 数组 fill null 即可

const length = 3
const filledArray = Array(length).fill(null).map(() => {
  return { value: 0 }
})
filledArray // [{value:0},{value:0},{value:0}]