如何简洁实现不修改原对象的对象函数式扩展？

嘿，这个坑我之前踩过！确实，不少extend方法会直接修改原对象，挺闹心的。给你几个简洁又靠谱的原生方案，完全不用动原对象：

1. ES6 展开语法（最推荐，写法最直观） #

直接用...把原对象的属性展开到新对象里，再添加或覆盖属性，原对象毫发无损：

const original = { name: 'Alice', age: 25 };
const extended = { ...original, age: 26, city: 'Beijing' };

console.log(original); // { name: 'Alice', age: 25 } 原对象没变化
console.log(extended); // { name: 'Alice', age: 26, city: 'Beijing' }

2. Object.assign() 方法 #

ES6官方提供的合并方法，只要第一个参数传空对象，就不会影响原对象：

const original = { name: 'Alice', age: 25 };
const extended = Object.assign({}, original, { age: 26, city: 'Beijing' });

console.log(original); // { name: 'Alice', age: 25 }
console.log(extended); // { name: 'Alice', age: 26, city: 'Beijing' }

⚠️ 注意：上面两种都是浅拷贝，如果对象里有嵌套的子对象，子对象还是会共享引用。如果需要深拷贝，可以用JSON.parse(JSON.stringify(original))（但要注意它不能处理函数、Symbol这类特殊值），或者写个递归深拷贝函数。

你想要的REPL会话示例 #

应该是这样的效果：

const obj = { x: 1 }
const extendedObj = { ...obj, y: 2 }
obj
{ x: 1 }
extendedObj
{ x: 1, y: 2 }

这样原对象完全保持原样，新对象就是扩展后的结果啦~

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