JavaScript中如何分组数组并生成含label和value的对象数组

原始数据 #

let array = [
  {name:"20220503",num:"0900"},
  {name:"20220503",num:"1500"},{name:"20220503",num:"1700"},
  {name:"20220504",num:"2000"}, {name:"20220505",num:"1100"}, 
  {name:"20220505",num:"1300"}
];

期望转换后的格式 #

{ 
'20220503':
   { 
     list: [ '0900', '1500', '1700' ],
     data: [
     {
       label: '0900',
       value: '0900'
     }, 
     {
       label: '1500',
       value: '1500'
     }, 
     {
       label: '1700',
       value: '1700'
     }
    ]
   },
'20220504': 
    { 
        list: [ '2000' ],
        data: [
         {
           label: '2000',
           value: '2000'
         },
        ]
    },
'20220505': 
    { 
    list: [ '1100', '1300' ], 
    data: [
         {
           label: '1100',
           value: '1100'
         }, 
         {
           label: '1300',
           value: '1300'
         },
       ]
    }
}

当前编写的代码 #

let array = [
   {date:"20220503",time:"0900"},
    {date:"20220503",time:"1500"},
    {date:"20220503",time:"1700"},
    {date:"20220504",time:"2000"},
    {date:"20220505",time:"1100"},
    {date:"20220505",time:"1300"},
    {date:"20220506",time:"100"},
    {date:"20220507",time:"5300"},
    {date:"20220507",time:"90100"},
    {date:"20220509",time:"2100"}
]
let result = array.reduce((acc,{date,time}) => {
    acc[date] = acc[date] || {list:[], data:[]}
    acc[date].list.push(time)
    acc[date].data.push(time)
    
    return acc;
},{})

console.log(result)

问题与修改方案 #

当前代码中acc[date].data.push(time)直接将字符串time推入数组，导致data是字符串数组，不符合目标格式。只需修改这一行，改为推入包含label和value的对象即可。

修改后的完整代码：

let array = [
   {date:"20220503",time:"0900"},
    {date:"20220503",time:"1500"},
    {date:"20220503",time:"1700"},
    {date:"20220504",time:"2000"},
    {date:"20220505",time:"1100"},
    {date:"20220505",time:"1300"},
    {date:"20220506",time:"100"},
    {date:"20220507",time:"5300"},
    {date:"20220507",time:"90100"},
    {date:"20220509",time:"2100"}
]
let result = array.reduce((acc,{date,time}) => {
    acc[date] = acc[date] || {list:[], data:[]}
    acc[date].list.push(time)
    // 修改此处，推入包含label和value的对象
    acc[date].data.push({ label: time, value: time })
    
    return acc;
},{})

console.log(result)

运行这段代码后，data数组就会变成包含label和value属性的对象数组，完全符合目标格式要求。

内容的提问来源于stack exchange，提问作者user19835203