JavaScript：使用 Reduce 重建對象數組

Question

我有一組對象，我試圖重建但沒有成功：

const data = [
    {
        ID: 1,
        TemplateName: 'Template 1',
        TemplateCategory: 'Category A',
    }, 
    {
        ID: 2,
        TemplateName: 'Template 2',
        TemplateCategory: 'Category A',
    }, 
    {
        ID: 3,
        TemplateName: 'Template 3',
        TemplateCategory: 'Category B',
    }, 
]

我有以下代碼，它會產生以下不良結果：

    result = [...data
      .reduce((acc, {TemplateCategory, TemplateName, ID}) => {
          const group = acc.get(TemplateCategory)
          group ? group.options.push(ID, TemplateName) : acc.set(TemplateCategory, {TemplateCategory, "options":[ID, TemplateName]})
          return acc
        }, new Map)
      .values()
    ]

console.log(result) // undesired result:
[
    {
        TemplateCategory: 'Category A',
        options: [1, 'Template 1', 2, 'Template 2']
    },
    {
        TemplateCategory: 'Category B',
        options: [3, 'Template 3']
    }
]

我堅持嘗試將options轉換為具有value和label作為屬性的對象數組。 我也在努力嘗試將TemplateCategory屬性改寫為label 。

我想要的結果是：

[
    {
        label: 'Category A',
        options: [
            {
                value: 1,
                label: 'Template 1'
            },
            {
                value: 2,
                label: 'Template 2'
            }
        ]
    },
    {
        label: 'Category B',
        options: [
            {
                value: 3,
                label: 'Template 3'
            }
        ]
    }
]

TIA

Answer 1

像這樣

 const data = [ { ID: 1, TemplateName: 'Template 1', TemplateCategory: 'Category A', }, { ID: 2, TemplateName: 'Template 2', TemplateCategory: 'Category A', }, { ID: 3, TemplateName: 'Template 3', TemplateCategory: 'Category B', }, ] const result = [...data.reduce((acc, {TemplateCategory, TemplateName, ID}) => { const group = acc.get(TemplateCategory) group? group.options.push({value: ID, label: TemplateName}): acc.set(TemplateCategory, {label: TemplateCategory, "options":[{value: ID, label: TemplateName}]}) return acc }, new Map).values() ] console.log(result) // undesired result: