数组赋值后修改对象属性导致原数组变更的技术问题

嘿，这个问题其实是JavaScript里引用类型的经典坑！当你写let dataToExport: any[] = this.employees;的时候，并没有真正复制出一个新数组——dataToExport只是和this.employees共享了同一个数组的引用。所以你后续遍历删除每个对象的profPic属性，本质上是在修改原数组里的对象，this.employees当然会跟着变啦。

下面给你几种靠谱的解决办法，根据你的场景选就行：

方法1：用解构+map直接排除不需要的属性（最推荐） #

这是最简洁优雅的方式，直接为每个对象生成一个不带profPic的新对象：

const dataToExport = this.employees.map(emp => {
  // 解构出profPic并丢弃，剩下的属性组成新对象
  const { profPic, ...restOfEmployee } = emp;
  return restOfEmployee;
});

这样生成的dataToExport是完全独立的新数组，每个元素也是新对象，绝对不会影响原数组this.employees。

方法2：先复制对象再删除属性 #

如果你习惯先复制整个对象再操作，可以用扩展运算符做浅拷贝，再删除目标属性：

const dataToExport = this.employees.map(emp => {
  // 扩展运算符创建原对象的浅拷贝
  const newEmployee = { ...emp };
  // 删除拷贝上的profPic，原对象不受影响
  delete newEmployee.profPic;
  return newEmployee;
});

特殊情况：处理嵌套对象 #

如果你的employees数组里的对象还有嵌套的子对象（比如emp.contactInfo这种），上面的浅拷贝方法不会复制嵌套对象，修改嵌套内容还是会影响原数组。这时候需要用深拷贝：

// 用JSON序列化实现深拷贝（注意：会丢失函数、Symbol等特殊类型）
const dataToExport = JSON.parse(JSON.stringify(this.employees)).map(emp => {
  delete emp.profPic;
  return emp;
});

// 或者用第三方工具库（比如Lodash的cloneDeep）
// import _ from 'lodash';
// const dataToExport = _.cloneDeep(this.employees).map(emp => {
//   delete emp.profPic;
//   return emp;
// });

如果你的对象结构比较简单，没有嵌套或者特殊类型，浅拷贝就足够用啦。

内容的提问来源于stack exchange，提问作者thegreathypocrite