如何在JavaScript数组中向code1对应对象添加新对象且不修改原有数据

要满足「不修改原有数据」的要求，不能直接对原数组、原嵌套对象做赋值修改，需要通过逐层创建副本的方式做不可变更新：全程不触碰原引用数据，在副本上完成属性合并，生成全新的数组和嵌套对象。

常用写法（ES6 展开运算符） #

避免硬编码数组索引定位目标项，通过遍历匹配code1键的方式更新，降低结构变动带来的风险：

// 生成全新数组，原数组全程不会被修改
const newArray = array.map((item) => {
  // 定位包含code1键的数组项
  if (item.hasOwnProperty('code1')) {
    // 为code1对应的对象创建全新副本
    const newCode1Value = {
      ...item.code1, // 先完整拷贝原code1下的所有原有属性
      // 以下为你需要添加的对象内容，同键值会自动覆盖原有值
      number: 3,
      name: "j"
    }
    // 返回替换了code1值的新数组项
    return {
      ...item,
      code1: newCode1Value
    }
  }
  // 非目标项直接返回，保持原对象引用
  return item
})

执行完成后的效果：

• 新数组newArray中，code1对应的对象值为{ number: 3, name: "j" }，符合添加要求
• 原数组array中，code1对应对象完全保留原有值{ number: 2, name: "e" }，没有被篡改

老环境兼容写法（Object.assign） #

如果需要兼容不支持展开运算符的老旧JS环境，可以用原生Object.assign实现完全相同的不可变更新逻辑：

const newArray = array.map((item) => {
  if (item.code1) {
    const newCode1Value = Object.assign({}, item.code1, { number: 3, name: "j" })
    return Object.assign({}, item, { code1: newCode1Value })
  }
  return item
})

• 禁止直接编写array[0].code1.number = 3这类赋值代码，这会直接修改原数组中的嵌套对象引用，违反「不修改原有数据」的要求
• 由于当前嵌套对象的属性都是数字、字符串这类基础类型，以上浅拷贝方案完全满足需求，不需要额外做深拷贝

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