JavaScript使用switch push对象时数组历史数据被覆盖问题求助

核心是JavaScript引用类型的赋值特性导致的：

• 你在全局作用域仅创建了唯一的attachmentObj对象，JS中对象属于引用类型，数组执行push操作时，实际存入数组的是该对象的内存地址引用，而非对象的独立拷贝。
• 每次调用addAttachmentToList函数时，你都直接修改同一个全局attachmentObj的imgUrl属性，由于所有数组中存储的引用都指向这同一个对象，所以最后一次修改的属性值会同步到所有引用的读取结果上，看起来就是之前存入的内容被覆盖了。
• 当你改为直接pushimgUrl字符串时，字符串属于JS基本数据类型，push时会做值拷贝，每个数组元素都是独立的字符串值，不存在引用共享的问题，因此运行正常。

只需要把attachmentObj的实例化逻辑挪到函数内部，保证每次调用都生成全新的独立对象即可：

var attachmentLinks = {
  pdf: [],
  docx: [],
  png: [],
  jpg: [],
  xlsx: [],
  pptx: [],
  other: [],
};
function addAttachmentToList(type, imgUrl) {
  // 每次调用创建新的独立对象
  let attachmentObj = {
    imgUrl: imgUrl,
    isDuplicate: false,
    duplicateCount: 0,
  };
  let fileType = type.toLowerCase();
  switch (fileType) {
    case 'pdf':
      attachmentLinks['pdf'].push(attachmentObj);
      break;
    case 'docx':
    case 'doc':
      attachmentLinks['docx'].push(attachmentObj);
      break;
    case 'png':
      attachmentLinks['png'].push(attachmentObj);
      break;
    case 'jpg':
    case 'jpeg':
    case 'jfif':
      attachmentLinks['jpg'].push(attachmentObj);
      break;
    case 'xlsx':
    case 'csv':
      attachmentLinks['xlsx'].push(attachmentObj);
      break;
    case 'pptx':
      attachmentLinks['pptx'].push(attachmentObj);
      break;
    default:
      attachmentLinks['other'].push(attachmentObj);
      break;
  }
}

额外优化：不需要通过this访问全局变量，直接调用全局定义的attachmentLinks即可，避免this指向异常的额外问题。

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