根據API數據創建對象並將其動態添加到數組中

Question

我有一個要從數據庫中提取的數據集。 這是一維的，我基本上需要使其更有條理。 我稱其為“扁平”。

我需要顯示一個標題，以及該標題下與該標題相關的項目。

數據以具有and section_name（標題）和item_name（項目）以及每個項目唯一的其他數據（例如下載URL等）的形式出現。

1. item_name（項目）_______ section_name（標題）
2. first_________________資金
3. 第二筆資金
4. third_________________資金
5. 第四篇
6. 第五_________________文學
7. 第六_________________文學
8. 第七_______________文學
9. 第八名：盡職調查

我不知道這些項目或部分的名稱是什么，或者每個部分有多少個項目，部分或項目。 如我所說，它非常平坦。 這需要是完全動態的，這就是為什么這會使我復雜化。

這是我所做的。

1. API調用以檢索數據。 將狀態存儲為數組的數據（作為對象數組存儲）。
2. 我創建一個空數組來存儲我的新結構化數據。
3. 我用foreach遍歷數據。
4. 我為新數據創建了一個新對象，以將其添加到新數組中，以便以后可以對其進行循環。
5. 我首先檢查以確保數據存在。
6. 為了創建頭文件，我檢查我的新空數組是否實際上是空的，或者我的section_name與上一個不同（在我從API調用獲得的原始數據數組中）
7. 我將section_names作為對象存儲在新數組（newArray.push（newObject）

我已經走了這么遠。 現在，我需要獲取與section_names相關的item_names，並將它們存儲在對象中的每個標題名稱下，或者至少存儲在相同的索引中。

 _generateInfo() { 

        let dataArray = this.state.stepTwoData
        let newArray =[]

        dataArray.forEach(function(item, index) {
            let newObject = {}
            if (index > 0) {
                if (newArray.length === 0 || item.investor_portal_section_name !== dataArray[index -1].investor_portal_section_name) {
                    newObject["name"] = item.investor_portal_section_name
                    newObject["items"] = []
                    newArray.push(newObject)
            } 

        })
        console.log(newArray)
    }

我嘗試將項目推送到新對象上的“數字”數組中，但這似乎無法正常工作。 有時它將復制我的newObject.name

檢查newObject.name ===數組中的section_names並將其推入新對象中的“ number”數組中只會創建新的鍵-值對，因此它仍然沒有關聯。

我嘗試在if語句和if section_name === newObject.name中再次循環遍歷，然后創建一個newObject並推送它，但是它只會重復推送其中一項，而不是遍歷所有項。

我需要遍歷並創建一個標題（每個不同的section_name一個標題）。 然后將與section_name對應的每個項目添加到其中。 像這樣

[
{section_name(header): "Funds",
items: [
 {
  name: item_name,
  sku: item_sku,
  url: item_url
},
{
 name: item_name,
 sku: item_sku,
 url: item_url
}]
},
{section_name(header):"Literature",
items: [
 {name: item_name,
  sku: item_sku,
  url: item_url
},
{
 name: item_name,
 sku: item_sku,
 url: item_url
}]}
]

Answer 1

使用關聯數組（字典）按類別將您的數據主題分類將可以完成工作。 我起草了一些POC代碼來說明這個想法。 關鍵元素是buildAssociativeArray函數

const raw_data = [
    {item_name: "first", section_name: "Funds"}, 
    {item_name: "second", section_name: "Funds"}, 
    {item_name: "third", section_name: "Funds"}, 
    {item_name: "fourth", section_name: "Literature"}, 
    {item_name: "fifth", section_name: "Literature"}, 
    {item_name: "sixth", section_name: "Literature"}, 
    {item_name: "seventh", section_name: "Literature"}, 
    {item_name: "eighth", section_name: "DueDilligence"}, 
]

function buildAssociativeArray(data) {
    const dictionary = {};
    for (var i = 0; i < data.length; i++) {
        const item = data[i];
        const section = item.section_name;
        var dictEntry = dictionary[section];
        if (!dictEntry) {
            dictEntry = [];
            dictionary[section] = dictEntry;
        }
        dictEntry.push({
            name: item.item_name,
            //    other fields like sku: item_sku or url: item_url may follow here
        });
    }
    return dictionary;
}

const dictionary = buildAssociativeArray(raw_data);
console.log(dictionary);
/*
At this point
dictionary == {
  "Funds": [
    {
      "name": "first"
    },
    {
      "name": "second"
    },
    {
      "name": "third"
    }
  ],
  "Literature": [
    {
      "name": "fourth"
    },
    {
      "name": "fifth"
    },
    {
      "name": "sixth"
    },
    {
      "name": "seventh"
    }
  ],
  "DueDilligence": [
    {
      "name": "eighth"
    }
  ]
}
*/

//    Associcative array dictionary itself allows to further solve you task using for (var key in dictionary) {...} operator
//    If however you need to obtain the data structure looking exactly like the one in your question you may go further with following function

function transformAssociativeArray(dictionary) {
    const array = [];
    for (var key in dictionary) {
        const items = dictionary[key];
        const newEntry = {
            section_name: key,
            items: items,
        }
        array.push(newEntry);
    }
    return array;
}

const array = transformAssociativeArray(dictionary);
console.log(array);
/*

At this point
array == [
  {
    "section_name": "Funds",
    "items": [
      {
        "name": "first"
      },
      {
        "name": "second"
      },
      {
        "name": "third"
      }
    ]
  },
  {
    "section_name": "Literature",
    "items": [
      {
        "name": "fourth"
      },
      {
        "name": "fifth"
      },
      {
        "name": "sixth"
      },
      {
        "name": "seventh"
      }
    ]
  },
  {
    "section_name": "DueDilligence",
    "items": [
      {
        "name": "eighth"
      }
    ]
  }
]
*/