首页 > 解决方案 > 如何使用 tyscript 更改数组的格式

问题描述

我的 Api 响应包含许多类似的值,我想将其更改为以下格式。

响应如下:

   {
    "data": [
          {name: "implemented", value: "0", label: "Apple"},
          {name: "notapplicable", value: "0", label: "Apple"},
          {name: "notimplemented", value: "0", label: "Apple"},
          {name: "partialimplemented", value: "0", label: "Apple"},
          {name: "planned", value: "0", label: "Apple"},
          {name: "unknown", value: "14", label: "Apple"},
          {name: "implemented", value: "3", label: "Orange"},
          {name: "notapplicable", value: "0", label: "Orange"},
          {name: "notimplemented", value: "0", label: "Orange"},
          {name: "partialimplemented", value: "0", label: "Orange"},
          {name: "planned", value: "0", label: "Orange"},
          {name: "unknown", value: "7", label: "Orange"}
     ]}

我想要以下格式的这个数组:

   {
    "data": [
          {
             name: "implemented", 
             value: [0,3], 
             label: ["Apple","Orange"]
          },
          {
             name: "notapplicable", 
             value: [0,0], 
             label: ["Apple","Orange"]
          },
          {
             name: "notimplemented", 
             value: [0,0], 
             label: ["Apple","Orange"]
          },
          {
             name: "partialimplemented", 
             value: [0,0], 
             label: ["Apple","Orange"]
          },
          {
             name: "planned", 
             value: [0,0], 
             label: ["Apple","Orange"]
          },
          {
             name: "unknown", 
             value: [14,7], 
             label: ["Apple","Orange"]
          }
     ]}

谁能帮我改变数组的格式???

标签: javascriptarraysangulartypescript

解决方案


你可以使用reduce函数然后获取map的值

 const raw = {
   "data": [{
       name: "implemented",
       value: "0",
       label: "Apple"
     },
     {
       name: "notapplicable",
       value: "0",
       label: "Apple"
     },
     {
       name: "notimplemented",
       value: "0",
       label: "Apple"
     },
     {
       name: "partialimplemented",
       value: "0",
       label: "Apple"
     },
     {
       name: "planned",
       value: "0",
       label: "Apple"
     },
     {
       name: "unknown",
       value: "14",
       label: "Apple"
     },
     {
       name: "implemented",
       value: "3",
       label: "Orange"
     },
     {
       name: "notapplicable",
       value: "0",
       label: "Orange"
     },
     {
       name: "notimplemented",
       value: "0",
       label: "Orange"
     },
     {
       name: "partialimplemented",
       value: "0",
       label: "Orange"
     },
     {
       name: "planned",
       value: "0",
       label: "Orange"
     },
     {
       name: "unknown",
       value: "7",
       label: "Orange"
     }
   ]
 }

 const formatted = raw.data.reduce((acc, cur) => {
   obj = acc[cur.name];
   if (!obj) {
     acc[cur.name] = {
       name: cur.name,
       value: [],
       label: []
     };
     obj = acc[cur.name];

   }

   obj.value.push(cur.value);
   obj.label.push(cur.label);
   return acc;
 }, {});

 console.log(Object.values(formatted));

推荐阅读