一、fill

    const arr = new Array(5).fill(1)

    arr[0] = 10
    console.log(arr) // [10, 1, 1, 1, 1]

但是fill填充的数组会有引用关系：

    const arr = new Array(5).fill({ name: 'xx' })

    arr[0].age = 10
    console.log(arr)

通过fill填充时，如果 value 是个对象，那么数组的每一项都会引用这个元素

二、fill结合map

    const arr = new Array(5).fill().map(()=>({name:'xx'}))

    arr[0].age = 10
    console.log(arr)

这样，数组的每一项之间没有引用关系

但是map会生成一个新的数组，当数组的数据量很大时，通过map来处理的效率不是很高

三、使用for循环替代map

这样也可以切断引用关系，但是效率比map高一点

    const arr = new Array(5)

    for (let i = 0, len = arr.length; i < len; i++) {
      arr[i] = { name: 'xx' }
    }
    arr[0].age = 10
    console.log(arr)

四、Array.from

    const arr = Array.from({ length: 5 }, () => ({ name: 'xx' }))
    
    arr[0].age = 10
    console.log(arr)

const arr = Array.from({ length: 5 }, () => ({ name: 'xx' }))可以写成

const arr = Array.from(Array(5), () => ({ name: 'xx' }))
或
const arr = Array.from(new Array(5), () => ({ name: 'xx' })) // new Array(5)和Array(5)是一个意思

补充说明：

1. 当Array()仅有一个参数且为数字时，数组此时并没有包含任何实际的元素，不能理所当然地认为它包含 arrayLength个值为 undefined 的元素，就是说创建出来的数组中的元素并没有被赋值（初始化）

    const arr = new Array(5)
    console.log(arr, arr.length) // [空属性 × 5] 5

并且此时使用forEach、map、reduce等方法遍历arr时，未初始化的项将被跳过

    // arr中的值都没有被初始化，所以没有打印
    arr.forEach(() => {
      console.log('>>>')
    })

2. 当Array()传入多个参数时，这些参数就是数组的值

    const arr = new Array(5, 6)
    console.log(arr, arr.length) // [5, 6] 2

五、展开运算符

使用...可以避免使用fill，但是这里使用了map

    const arr = [...new Array(5)].map(() => ({ name: 'xx' }))

    arr[0].age = 10
    console.log(arr)