fill().map()方法注意事项

如果数组中每一项为简单数据类型

var d=[1,2,3,4,5,6,7]
let e=d.map((item,index)=>{
    item+=1
    return item
 })
console.log(d);// [1, 2, 3, 4, 5, 6, 7]   （不改变原数据）
console.log(e);// [2, 3, 4, 5, 6, 7, 8]

 

如果数组中每一项为引用数据类型

var a=[{q:'w'},{q:'w'},{q:'w'},{q:'w'},{q:'w'},{q:'w'},{q:'w'}]
let b=a.map((item,index)=>{
    item.q+=1
    return item
})
console.log(a);
console.log(b);

a和b的结果分别为：（改变原数据）

 

 

利用Array.fill(引用数据类型).map()

const c= Array(10).fill({title:'标题-',state:'状态'}).map((item,index)=>{
    item.title+=1
    item.id=index
    return item
})
console.log(c);

 

 原因：map()中的item遍历的不是基本类型时，比如数组、对象，item操作的是对应地址上的数据，从而使得引用到该地址的原数据改变，所以原数据a改变；而fill填充的数组的每一项都指向的是同一个对象，就会出现"牵一发而动全身"的现象，遍历、改变的一直都是同一个数据。