JavaScript 中怎么结合解构与展开语法实现对象合并-js教程-PHP中文网

JavaScript中对象合并本质是用展开运算符（...）摊开对象后用字面量包裹，实现属性级浅合并；解构常配合展开选择性提取字段，但不直接合并；需注意嵌套对象会被整体替换，深合并需额外处理。

javascript 中怎么结合解构与展开语法实现对象合并

JavaScript 中结合解构与展开语法实现对象合并，本质是用展开运算符（...）把对象“摊开”，再用对象字面量包裹，完成属性级融合。解构本身不直接用于合并，但常配合展开使用——比如先解构提取部分字段，再与其他展开对象组合。

用展开运算符直接合并对象

这是最常用、最直观的方式。多个对象按顺序展开进一个新对象，后出现的同名属性会覆盖前面的。

语法简洁：{...obj1, ...obj2}
不修改原对象，返回全新对象
适用于现代环境（Chrome 60+、Firefox 60+、Node.js 8.3+）

示例：

const defaults = { theme: 'light', fontSize: 14, color: '#333' };
const overrides = { fontSize: 16, fontFamily: 'sans-serif' };

const config = { ...defaults, ...overrides };
// → { theme: 'light', fontSize: 16, color: '#333', fontFamily: 'sans-serif' }

解构 + 展开：有选择地合并字段

当只需合并部分属性，或想重命名、默认值、排除某些字段时，可先解构再展开。

java-api-doc-generator

分析 Java Spring Boot 后端 Controller 代码，自动生成 Markdown 格式的接口文档。当用户说“生成 Java 接口文档”、“生成 API 文档”、“从 Spring 代码生成文档”时触发。

下载

解构提取需要的字段（支持别名、默认值）
再用展开运算符合并其他对象或剩余字段
适合配置精修、表单数据清洗等场景

示例：

const user = { id: 101, name: 'Alice', email: 'a@b.com', createdAt: '2023-01-01' };
const meta = { lastLogin: '2026-09-30', status: 'active' };

// 只取 name 和 email，重命名 email 为 contact，并添加 meta
const profile = {
  ...({ name, email: contact } = user, { name, contact }),
  ...meta
};
// → { name: 'Alice', contact: 'a@b.com', lastLogin: '2026-09-30', status: 'active' }

注意浅合并的限制

展开和解构都只做浅层合并——嵌套对象会被整体替换，不会递归融合。

比如 { user: { name: 'A' } } 和 { user: { age: 25 } } 合并后，user 变成 { age: 25 }，name 丢失
如需深合并，不能依赖解构或展开，得用 _.merge() 或手写递归函数
若想保留嵌套结构中的部分字段，可手动解构嵌套对象再展开，例如：{ ...obj1, user: { ...obj1.user, ...obj2.user } }