Object.assignの不変バージョンはありますか？

Question

私はJavaScriptで2つのオブジェクトをミックスしたい：

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 } 

新しいオブジェクトにbへaを割り当てる方法はありますか？

Answer 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

Answer 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);

Answer 3

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

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

あなたは必要とするために割り当てメソッド内{}最初のオブジェクトここで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 3であることに注意してください。

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

const moreStyle = {...lessStyle, color: 'red'};