嵌套對象分配 Javascript

Question

我有兩個這樣的對象：

var a = {prop:{a:'1'}}
var b = {prop:{b:'1'}}

我想使用 Object.assign 合並兩個對象。 我試過這個：

var c = Object.assign(a,b)
> {prop:{b:'1'}}

我如何獲得此輸出：

{prop:{a:'1',b:'1'}}

簡而言之，我想對每個子對象進行對象分配 =>（如果存在財產，請首先檢查兒童，如果它是對象，請勿覆蓋）

Answer 1

您可以為對象的每個級別使用深度合並功能。

函數deepMerge作為給定目標的單個函數或作為Array#reduce回調，其中迭代一個對象數組，並提供一個空對象作為還原的startvalue 。

函數/回調itselft有兩個參數，一個用於目標對象，另一個用於源對象，其中所有條目都被采用和迭代。

檢查對象的值，如果類型是對象，則使用新的目標屬性（如果未給出）或exitent屬性對deepMerge進行遞歸調用。

如果該值不是對象，則使用給定鍵將值分配給target 。

結果是一個具有給定對象的所有屬性的新對象。

 function deepMerge(target, source) { Object.entries(source).forEach(([key, value]) => { if (value && typeof value === 'object') { deepMerge(target[key] = target[key] || {}, value); return; } target[key] = value; }); return target; } var a = { prop: { a: '1' } }, b = { prop: { b: '1' } }, c = [a, b].reduce(deepMerge, {}); console.log(c); 

Answer 2

由於你的案例中的a和b包含一個具有相同名稱的屬性，當你執行像Object.assign(a,b)這樣的事情時Object.assign(a,b)的prop屬性會覆蓋並且不會合並prop。 參考

請嘗試以下方法：

 var a = {prop:{a:'1'}} var b = {prop:{b:'1'}} var c = {}; c.prop = Object.assign({},a.prop,b.prop); console.log(c); 

要么

您可以編寫自己的自定義函數，該函數可以合並具有相同屬性的對象的值。

請嘗試以下方法：

 function merge(source, target) { Object.keys(source).forEach((k) => { if (source[k].constructor.toString().indexOf('Object') > -1 && target[k]) { merge(source[k], target[k]); return; } target[k] = source[k]; }); return target; } var a = {prop:{a: '1'}}; var b = {prop:{ b: '1'}}; var c = {}; [a,b].forEach((e)=>merge(e, c)); console.log(c); 

Answer 3

如果Object.assign沒有硬性要求，你可以在es6中這樣做：

 var c = {prop:{...a.prop, ...b.prop}}

請參閱擴展語法上的 MDN