数组的map方法易错点

map方法到底会不会改变原始数组？
结论：如果数组是值类型，并不会改变原始数组，而数组是引用类型，会改变原始数组
示例：
值类型：

const arr = [1, 2, 3]
const result = arr.map(item => {
  item = item * 3;
  return item;
});
console.log('arr', arr);     // [1, 2, 3]
console.log('result', result);  // [3, 6, 9]

可以看到，item虽然重新被赋值成了item * 3，但最后打印的结果显示arr并没有被改变。

引用类型：

const arr = [
  { name: 'Tom', age: 16 },
  { name: 'Aaron', age: 18 },
  { name: 'Denny', age: 20 }
]
const result = arr.map(item => {
  item.age = item.age + 2;  // 将他们的年龄都加2
  return item
});
console.log('arr', arr); 
console.log('result', result);

可以看出：原数组和新数组都发生了改变
发生这种情况的官方解释：map 不修改调用它的原数组本身 （当然可以在 callback 执行时改变原数组）。

map方法体现的是数据不可变的思想。该思想认为所有的数据都是不能改变的，只能通过生成新的数据来达到修改的目的，因此直接对数组元素或对象属性进行操作的行为都是不可取的。

正确的做法应该是声明一个新变量来存储map的结果，而不是去修改原数组。

const arr = [
  { name: 'Tom', age: 16 },
  { name: 'Aaron', age: 18 },
  { name: 'Denny', age: 20 }
]
const result = arr.map(item => ({
  ...item,
  age: item.age + 2
}));
console.log('arr', arr);
console.log('result', result);

或者使用：Object.assign 浅拷贝