本文介绍如何在 JavaScript 中实现嵌套对象的“浅层覆盖式”更新——即仅用更新对象中显式提供的键值对修改原对象，其余嵌套结构与未提及的属性完整保留，避免 Object.assign 等浅拷贝方法导致的数据丢失。
本文介绍如何在 javascript 中实现嵌套对象的“浅层覆盖式”更新——即仅用更新对象中显式提供的键值对修改原对象，其余嵌套结构与未提及的属性完整保留，避免 `object.assign` 等浅拷贝方法导致的数据丢失。
在处理配置对象、表单状态或 API 响应数据时，常需局部更新深层嵌套结构（如 obj.a.b.c），同时严格保留其他未被提及的字段（如 obj.a.b.d 和 obj.a.e）。此时若直接使用 Object.assign(obj, updateObj) 或扩展运算符 {...obj, ...updateObj}，会完全替换目标层级的对象，造成意外删减——这正是问题中 obj.a.e 消失的根本原因。
正确的做法是执行递归、键级精准合并：仅遍历更新对象中的键，对每个键做如下判断：
- 若其值为普通值（字符串、数字、布尔等），则直接覆写原对象对应路径的值；
- 若其值为对象，则递归进入该子路径，继续执行相同逻辑；
- 若原对象中不存在该键，则跳过（不新增）；若更新对象中缺失某键，则原值保持不变。
以下是经过优化、健壮性增强的实现：
const isPlainObject = (value) =>
value !== null &&
typeof value === 'object' &&
value.constructor === Object;
const deepUpdate = (target, updates) => {
if (!target || !updates || typeof target !== 'object' || typeof updates !== 'object') {
return;
}
for (const key of Object.keys(updates)) {
const updateValue = updates[key];
// 仅当原对象存在该键时才允许更新（保证不新增字段）
if (key in target) {
if (isPlainObject(updateValue) && isPlainObject(target[key])) {
deepUpdate(target[key], updateValue); // 递归深入
} else {
target[key] = updateValue; // 覆盖基础值或替换非对象类型
}
}
}
};
✅ 使用示例：
let obj = {
a: {
b: { c: 1, d: 2 },
e: { f: 3 }
}
};
const updateObj = {
a: {
b: { c: "boo" }
}
};
deepUpdate(obj, updateObj);
console.log(obj);
// 输出：
// {
// a: {
// b: { c: "boo", d: 2 }, // ✅ c 被更新，d 保留
// e: { f: 3 } // ✅ e 完整保留
// }
// }
⚠️ 注意事项：
- 该函数就地修改（mutating）原对象。如需不可变更新，请先深拷贝 target（例如用 structuredClone 或第三方库）；
- 不支持数组更新（如 a: [1,2] 中部分项更新），如需数组合并逻辑需额外扩展；
- 严格校验 constructor === Object 可避免误处理 Date、RegExp 等内置对象；
- 若更新值为 null 或 undefined，将直接赋值覆盖（符合预期）；若需跳过 undefined，可增加 updateValue !== undefined 判断。
此方案兼顾简洁性与可控性，是构建状态管理、配置补丁、API 增量同步等场景的理想基础工具。
