是否有 Object.assign 的不可变版本？答案

【问题标题】：Is there an immutable version of Object.assign?是否有 Object.assign 的不可变版本？
【发布时间】：2016-12-01 17:20:37
【问题描述】：

我想在 JavaScript 中混合两个对象：

let a = {x: 1, y: 2, z:3};
let b = {x:10, y: 20};

let c = Object.assign(a, b);

这给出了c 的正确值：

Object { x: 10, y: 20, z: 3 }

但是现在a也被修改了！

Object { x: 10, y: 20, z: 3 }

有没有办法将a 分配到b 到一个新对象中？

【问题讨论】：

标签： javascript immutability assign

【解决方案1】：

assign 的第一个参数是目标。所以它会改变。如果您不希望任何源更改，您可以简单地为您的目标传递一个空对象：

let a = {x: 1, y: 2, z:3};
let b = {x:10, y: 20};

let c = Object.assign({},a, b);
console.log(c);
console.log(a);    // a is unchanged

【讨论】：

如果值是引用，它将不是不可变的。

【解决方案2】：

你可以使用spread operator:

let a = {x: 1, y: 2, z: 3};
let b = {x: 10, y: 20};

let c = {
  ...a,
  ...b
}

console.log(c);
console.log(a);

【讨论】：

扩展运算符是一个美丽的东西。 Babel 插件：babeljs.io/docs/plugins/transform-object-rest-spread

【解决方案3】：

绝对是扩展运算符。它有助于添加单个属性，例如在 JS 中设置 CSS 样式。但请注意，它目前是 EcmaScript 的 only in stage 4。

const lessStyle = {
    color: 'blue',
    backgroundColor: 'yellow'
};

const moreStyle = {...lessStyle, color: 'red'};
// lessStyle is not affected

你现在可以在 Typescript 和 JSX 中使用它。

【讨论】：

【解决方案4】：

let a = {x: 1, y: 2, z:3};
let b = {x:10, y: 20};

let c = Object.assign({}, a, b);

您需要在第一个对象的 assign 方法中使用 {}，因为如果您在此处阅读 Object.assign 方法的文档https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign#Parameters 它声明第一个参数是目标对象，其余是源对象。所以现在你将 b 分配给 a 并将新的 a 返回给 c。因此，如果您的第一个参数是一个空对象，则不会发生这种情况。

【讨论】：