js fill初始化数组问题

Question

   var arr = new Array(3).fill({
     name: 'deng',
     age: 18,
     job: 'software'
   })

   console.log(arr)

   arr[0].name = 'dengbbbb'

   console.log(arr)

这样只改变其中一个属性 为啥其他对象相应的属性也跟着改变了啊 有大佬知道这个是什么问题么？？？

Answer 1

因为Array.fill()如果填充类型为对象，则为浅拷贝。数组内的3个对象指向的都是同一个内存地址。

你可以这样做

var arr = new Array(3).fill(JSON.stringify({
    name: 'deng',
    age: 18,
    job: 'software'
}))
    arr=arr.map(item=>JSON.parse(item))
    console.log(arr)

    arr[0].name = 'dengbbbb'

    console.log(arr)

关于深拷贝与浅拷贝可以参考以下文章

js 深拷贝 vs 浅拷贝

Answer 2

如果简单明了点说，就是他们指向了同一块儿内存。所以一个变动就多个一起变动。
如果想要各自独立，就得指向不同的内容。

Answer 3

var arr = Array.apply(null, { length: 3 }).map(() => ({
    name: 'deng',
    age: 18,
    job: 'software'
}));
arr[0].name = 'dengbbbb';
console.log(arr);