本文介绍在 javascript 中如何仅更新数组内某个对象的若干属性（如 creator、title、message），同时保持其余字段（如 id）不变，推荐使用对象展开运算符实现简洁、安全的浅层合并。

本文介绍在 javascript 中如何仅更新数组内某个对象的若干属性（如 creator、title、message），同时保持其余字段（如 id）不变，推荐使用对象展开运算符实现简洁、安全的浅层合并。

在实际开发中，我们常需局部更新数组中某个对象的部分字段，而非整体替换——尤其当对象包含不可变标识（如 id）、时间戳或服务端返回的只读字段时。直接解构赋值（如 [obj.a, obj.b] = [valA, valB]）虽可行，但可读性差、易出错，且难以扩展。

更优雅、推荐的做法是利用 对象展开运算符（spread syntax） 进行浅层合并：

const myArray = [
  {"id": 0, "creator":"Foo", "title":"title1", "message":"message1"},
  {"id": 1, "creator":"Bar", "title":"title", "message":"message2"}
];

const payload = {"creator":"creator3", "title":"title3", "message":"message3"};
const indexToUpdate = 0;

// ✅ 推荐：一行完成局部更新，保留原对象所有未覆盖字段（如 id）
myArray[indexToUpdate] = { ...myArray[indexToUpdate], ...payload };

该写法本质是：先展开原对象（确保 id 等原有属性被保留），再用 payload 中同名属性覆盖对应字段。由于 payload 不含 id，因此 id 值完全不受影响。

⚠️ 注意事项：

• 此操作为浅拷贝，仅适用于纯对象（无嵌套引用）。若需深层更新，请考虑 structuredClone() 或专用库（如 lodash 的 merge）；
• 直接修改原数组（mutating）；如需不可变更新（例如 React 场景），应创建新数组：

  const updatedArray = myArray.map((item, i) => 
    i === indexToUpdate ? { ...item, ...payload } : item
  );

• 避免使用 Object.assign() 的冗余写法（如 Object.assign(myArray[i], payload)），因其会污染原对象且无法保护只读属性。

总结：{ ...original, ...update } 是现代 JavaScript 中更新对象子集字段最简洁、语义清晰且符合函数式编程习惯的方式，兼顾可读性、健壮性与维护性。