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

Question

我想在 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 到一个新对象中？

Answer 1

您可以使用 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);

Answer 2

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

Answer 3

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。因此，如果您的第一个参数是空对象，则不会发生这种情况。

Answer 4

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

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

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

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

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

Is there an immutable version of Object.assign?

javascript

immutability

assign