Question

我有以下复杂数组

[
   {
      label: "Country1",
      metrics: [
         {
            label: "xyz",
            metric: "xyz",
            value: 234184
         },
         {
            label: "abc",
            metric: "abc",
            value: 145678
         }
      ]
   },
   {
      label: "Country2",
      metrics: [
         {
            label: "xyz",
            metric: "xyz",
            value: 123456
         },
         {
            label: "abc",
            metric: "abc",
            value: 456789
         }
      ]
   },
   {
      label: "Country3",
      metrics: [
         {
            label: "xyz",
            metric: "xyz",
            value: 62389
         },
         {
            label: "abc",
            metric: "abc",
            value: 4964738
         }
      ]
   }
]

我需要将其转换为以下简单数组，其中从metrics子数组中，label和value的值成为键值对。

[
    {label: “Country1”, xyz: 234184, abc: 145678},
    {label: “Country2”, xyz: 123456, abc: 456789},
    {label: “Country3”, xyz: 62389, abc: 4964738}
]

可以使用lodash进行这种转换吗？

Answer 1

也许会有更好/更清洁的方法来做到这一点，但这是我在短短几分钟内能想到的。

const inputData = [
   {
      label: "Country1",
      metrics: [
         {
            label: "xyz",
            metric: "xyz",
            value: 234184
         },
         {
            label: "abc",
            metric: "abc",
            value: 145678
         }
      ]
   },
   {
      label: "Country2",
      metrics: [
         {
            label: "xyz",
            metric: "xyz",
            value: 123456
         },
         {
            label: "abc",
            metric: "abc",
            value: 456789
         }
      ]
   },
   {
      label: "Country3",
      metrics: [
         {
            label: "xyz",
            metric: "xyz",
            value: 62389
         },
         {
            label: "abc",
            metric: "abc",
            value: 4964738
         }
      ]
   }
];

const newData = _.map(inputData, first => {
  const additional = _.map(first.metrics, metric => [metric.label, metric.value]);
  return _.assign({}, _.fromPairs(additional), {
    label: first.label
  });
});
  
console.log(newData);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.js"></script>

Answer 2

这是不需要lodash的解决方案，您只需要利用Array#map来变换顶级数组中的每个项目，然后使用Array#reduce来变换对象并利用获得所需的其余属性。下面使用的方法利用了以下ES6功能：

Destructuring assignment从Array#map和Array#reduce回调中提取属性。
Spread Syntax来组合来自不同来源的对象的属性。
Computed property names表示对象中的动态属性名称。

var result = data.map(({ label, metrics }) =>
  metrics.reduce(
    (result, { metric, value }) => ({ ...result, [metric]: value }),
    { label }
  )
);

var data = [{label:"Country1",metrics:[{label:"xyz",metric:"xyz",value:234184},{label:"abc",metric:"abc",value:145678}]},{label:"Country2",metrics:[{label:"xyz",metric:"xyz",value:123456},{label:"abc",metric:"abc",value:456789}]},{label:"Country3",metrics:[{label:"xyz",metric:"xyz",value:62389},{label:"abc",metric:"abc",value:4964738}]}];

var result = data.map(({ label, metrics }) =>
  metrics.reduce(
    (result, { metric, value }) => ({ ...result, [metric]: value }),
    { label }
  )
);

console.log(result);

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

使用lodash从复杂数组中检索值

2 个答案: