如何在TypeScript中基于现有对象创建独立新对象？

你遇到的问题本质是对象引用导致的——TypeScript/JavaScript里对象属于引用类型，直接赋值const newEmployee1 = employee只是复制了指向原对象的引用，所有变量最终指向同一个内存地址，修改任意一个都会影响所有变量。

要创建独立的对象副本并修改指定属性，常用的几种方案如下：

1. 对象展开运算符（最简洁推荐） #

通过...展开原对象的所有属性，同时覆盖需要修改的属性，生成全新对象：

interface User {
    name: string, 
    jobTitle: string
}

const employee: User = {name: 'Liane', jobTitle: 'Web Dev'}

const newEmployee1 = {...employee, name: 'James'};
const newEmployee2 = {...employee, name: 'John'};

console.log(employee);      // {name: 'Liane', jobTitle: 'Web Dev'}
console.log(newEmployee1);  // {name: 'James', jobTitle: 'Web Dev'}
console.log(newEmployee2);  // {name: 'John', jobTitle: 'Web Dev'}

2. Object.assign() 方法 #

将原对象属性复制到空对象，再传入要修改的属性实现覆盖：

const newEmployee1 = Object.assign({}, employee, {name: 'James'});
const newEmployee2 = Object.assign({}, employee, {name: 'John'});

3. 解构赋值结合剩余属性 #

先解构出不需要修改的属性，再组合并替换目标属性：

const { name: _, ...restProps } = employee;
const newEmployee1 = { ...restProps, name: 'James' };
const newEmployee2 = { ...restProps, name: 'John' };

注意事项 #

以上方法都属于浅拷贝，仅适用于没有嵌套对象的扁平结构。如果你的对象包含嵌套对象（如{name: 'Liane', job: {title: 'Web Dev', dept: 'IT'}}），嵌套部分仍会保留引用关系，此时需要用深拷贝：

• 简单场景可使用JSON.parse(JSON.stringify(employee))（注意会忽略函数、undefined、Symbol等类型）；
• 复杂场景可使用第三方工具库（如Lodash的cloneDeep）。

内容的提问来源于stack exchange，提问作者Web Develop Wolf