javascript - 如何修改对象的javascript数组，例如将对象值修改为键值对

Question

我是 JavaScript 编程和 React 新手。我有一个数据结构，我使用 array.reduce 方法将其转换为下面给定的数组。

我的目标是重新构造数组，以便在图表中使用它来使用 React Chart JS 2 可视化数据。

const charData = [
    {
        "year": "2020",
        "value": [
            {
                "levelName": "Platinum",
                "yearlyCount": "1074"
            },
            {
                "levelName": "Gold",
                "yearlyCount": "1847"
            },
            {
                "levelName": "Silver",
                "yearlyCount": "4804"
            }
        ]
    }
]

我需要以下结构

[
{
"year": "2020",
"Platinum": "1074",
"Gold": "1847",
"silver": "4804"
}
]

Answer 1

将map与reduce结合使用

const charData =  [
    {
        "year": "2020",
        "value": [
            {
                "levelName": "Platinum",
                "yearlyCount": "1074"
            },
            {
                "levelName": "Gold",
                "yearlyCount": "1847"
            },
            {
                "levelName": "Silver",
                "yearlyCount": "4804"
            }
        ]
    }
]

const res = charData.map(item => {
  const subRes = item.value.reduce((acc,i) => {
    return {
     ...acc,
     [i.levelName]  : i.yearlyCount
     
    }
  }, {})
  
  return {
    year: item.year,
    ...subRes,
  }
  
})

console.log(res)