如何將 arrays 的 object 變成對象數組？

Question

axios得到的數據結構為：

{
    "data": {
        "project": {
            "id": "5ebd525ea3ff2434c0d467f8",
            "items": [
                {
                    "name": "item one",
                    "size": 45,
                    "createdAt": "2020-05-14T14:15:43.034Z",
                },
                {
                    "name": "item two",
                    "size": 23,
                    "createdAt": "2020-05-14T14:15:58.508Z",
                },
                {
                    "name": "item one",
                    "size": 93,
                    "createdAt": "2020-05-14T15:02:19.889Z"
                },
                {
                    "name": "item two",
                    "size": 55,
                    "createdAt": "2020-05-19T02:48:14.486Z"
                }
            ]
        }
    }
}

我需要完成的是兩件事：

• 按名稱對項目進行分組
• map 到新的 arrays 以在圖表中呈現

我的代碼是

async created() {
      const response = await axios.get(
        `http://localhost:1337/projects/${this.routeId}`
      ))
      const { items } = response.data

  //returns new array of only fields needed to send to the chart
      const newArray = items.map(({name, size, createdAt}) => ({name, size, createdAt}))

 // group items by name **** this creates an object of arrays
      const groupBy = (array, key) => {
        return array.reduce((result, currentValue) => {
          (result[currentValue[key]] = result[currentValue[key]] || [])
          .push(currentValue);
          return result
        }, {})
      };
      const itemsGroupedByName = groupBy(newArray, 'name')

  //this fails *** trying to map an object into a new array
      itemsGroupByName.forEach(d => {
        const { name, size, createdAt } = d
        this.arrItemSize.push({
          date: moment(createdAt).format('MMM D YYYY'),
          total: size,
          name
        })
      })
    },

上面的代碼將項目分組為 arrays 的 object -

{ [...], [...], [...], [...] }

圖表需要的格式是對象數組

[ {...}, {...}, {...}, {...]

我如何將 map 分組到新的 arrays？ 謝謝你的幫助

Answer 1

您可以使用 function Array.prototype.reduce進行分組，使用 function Object.values提取分組對象。

這是假設屬性items將包含分組對象。

 let obj = { "data": { "project": { "id": "5ebd525ea3ff2434c0d467f8", "items": [ { "name": "item one", "size": 45, "createdAt": "2020-05-14T14:15:43.034Z", }, { "name": "item two", "size": 23, "createdAt": "2020-05-14T14:15:58.508Z", }, { "name": "item one", "size": 93, "createdAt": "2020-05-14T15:02:19.889Z" }, { "name": "item two", "size": 55, "createdAt": "2020-05-19T02:48:14.486Z" } ] } } }; let result = Object.values(obj.data.project.items.reduce((a, {name, ...rest}) => { (a[name] || (a[name] = {items: []}))["items"].push({name, ...rest}); return a; }, Object.create(null))); console.log(result);

 .as-console-wrapper { max-height: 100%;important: top; 0; }