遞歸嵌套的數組轉換成嵌套對象使用對象的密鑰爲每個陣列

Question

我想改變這個數據結構：

[ { sectionName: 'SectionOne', 
    ingredients: [ {ingredient: 'sugar'}, {ingredient: 'flour'} ]}, 
    { sectionName: 'SectionTwo', 
    ingredients: [ {ingredient: 'eggs'}, {ingredient: 'water'} ] }, 
] 

這樣：

{ SectionOne: 
     { sectionName: 'SectionOne', 
     ingredients: { 
      sugar: { ingredient: 'sugar' }, 
      flour: { ingredient: 'flour' } 
      } 
     }, 
{ SectionTwo: 
     { sectionName: 'SectionTwo', 
     ingredients: { 
      eggs: { ingredient: 'eggs' }, 
      water: { ingredient: 'water' } 
      } 
     }, 

} 

換句話說，我喜歡爲每個我想要轉換爲對象的數組使用對象的鍵。

你可以在這個 jsfddle 以及我的嘗試中找到一個數據結構的例子。我只能轉換外層數組。 我無法管理遞歸使用_.mapKeys（），for循環或類似的去達到所需的結構。我確信我錯過了一個愚蠢的觀點，但我無法繞過這一點。

幫助將非常感謝！

Answer 1

您可以map數組和構建你的目標很簡單明瞭：

const data = [ 
 
    { sectionName: 'SectionOne', 
 
    ingredients: [ {ingredient: 'sugar'}, {ingredient: 'flour'} ]}, 
 
    { sectionName: 'SectionTwo', 
 
    ingredients: [ {ingredient: 'eggs'}, {ingredient: 'water'} ] }, 
 
]; 
 
    
 
const res = Object.assign(...data.map(el => ({ // for every element 
 
    [el.sectionName]: { 
 
    sectionName: el.sectionName, 
 
    ingredients: Object.assign(...el.ingredients.map(e => ({[e.ingredient]: e}))) // assign each object inside array 
 
    } 
 
    }))) 
 

 
console.log(res) 
 
console.log(res.SectionOne.ingredients.sugar)

這裏[something]符號創建密鑰，它的名字是something變量的值。三個點...將數組分散到單獨的元素中，就像這些元素之間用逗號分隔。

Answer 2

這裏有一個使用reduce的工作解決方案。您可能可以重構這更多：

const sections = [ 
    { sectionName: 'SectionOne', 
    ingredients: 
     [ 
     {ingredient: 'sugar'}, 
     {ingredient: 'flour'} 
     ] 
    }, 
    { sectionName: 'SectionTwo', 
    ingredients: 
     [ 
     {ingredient: 'eggs'}, {ingredient: 'water'} 
     ] 
    }, 
]; 

const result = sections.reduce((accumulator, currentValue) => { 
    const ingredientsObj = currentValue.ingredients.reduce((acc, ingredient) => { 
    acc[ingredient.ingredient] = { 
     ingredient: ingredient.ingredient 
    }; 
    return acc; 
    }, {}); 

    var sectionObject = { 
    sectionName: currentValue.sectionName, 
    ingredients: ingredientsObj 
    } 
    accumulator[currentValue.sectionName] = sectionObject; 
    return accumulator; 

}, {}); 

console.log(result);