如何從帶有嵌套對象的 JSON 中提取兩個 arrays

Question

我正在嘗試在 ReactJs 中生成菜單和子菜單。 數據來自 JSON 格式的外部 api。

這是 JSON 數據：

[
    {
        "content": "A",
        "Subtypes": [
            {
                "content": "1"
            },
            {
                "content": "2"
            },
            {
                "content": "3"
            }
        ]
    },
    {
        "content": "B",
        "Subtypes": [
            {
                "content": "10"
            },
            {
                "content": "20"
            },
            {
                "content": "30"
            },
            {
                "content": "40"
            }
        ]
    },
    {
        "content": "C",
        "Subtypes": [
            {
                "content": "X"
            },
            {
                "content": "Y"
            },
            {
                "content": "Z"
            }
        ]
    }
]

我想從上面的 JSON 數據中生成兩個 arrays，類似於下面的：

Array1 = ["A","B","C"]

Array2 = {
            A: ["1", "2", "3"],
            B: ["10", "20", "30", "40"],
            C: ["X", "Y", "Z"]
        };

我怎樣才能做到這一點？ 謝謝。

Answer 1

我不確定這是否是您需要的，因為您提到了兩個 arrays 並且您示例中的 array2 是 object

const firstArray = [],
    secondArray = [];

json.forEach(({
    content,
    Subtypes
}) => {
    firstArray.push(content);
    secondArray.push(Subtypes.map(({
        content
    }) => content));
});

如果您的意思是第二個陣列的 object，您可以將其更新為

secondArray[content] = Subtypes.map(({content}) => content);

Answer 2

下面的代碼給出了你想要的 output，var ff 是數組

ff.reduce((accm, cv, cidx, arr) => {
   accm.array1.push(cv.content);
   accm.array2[cv.content] = cv.Subtypes.map(t => t.content);
   return accm;
}, { array1: [], array2: {} });

Answer 3

這是用 typescript 編寫的示例代碼，給出了上述 output。

 let s = [ { "content": "A", "Subtypes": [ { "content": "1" }, { "content": "2" }, { "content": "3" } ] }, { "content": "B", "Subtypes": [ { "content": "10" }, { "content": "20" }, { "content": "30" }, { "content": "40" } ] }, { "content": "C", "Subtypes": [ { "content": "X" }, { "content": "Y" }, { "content": "Z" } ] } ] type subType = { [k: string]: any } let contentList: string[] = [] let obj: subType = {}; s.forEach((c) => { contentList.push(c.content); obj[c.content] = []; c.Subtypes.forEach((e) => { obj[c.content].push(e.content); }); }) console.log(obj) console.log(contentList)

Answer 4

 const obj = {} const data = [ { "content": "A", "Subtypes": [ { "content": "1" }, { "content": "2" }, { "content": "3" } ] }, { "content": "B", "Subtypes": [ { "content": "10" }, { "content": "20" }, { "content": "30" }, { "content": "40" } ] }, { "content": "C", "Subtypes": [ { "content": "X" }, { "content": "Y" }, { "content": "Z" } ] } ] data.map(el => { obj[el.content] = el.Subtypes.map(e => e.content) }); console.log(obj) console.log(Object.keys(obj))