通过利用 _.map 和 ._groupBy 用 lodash 重构数组

Question

我希望用 lodash 重构一组对象。

我一直在尝试改编网上找到的许多示例，但没有任何运气。看来我必须使用_.map 和._groupBy 的组合，但我无法真正解决这个问题。

感谢任何帮助！

初始数组：

const entries = [
  {
    year: '2019',
    children: [
      { name: 'red', amount: 1, label: 'color' },
      { name: 'yellow', amount: 20, label: 'color' },
      { name: 'green', amount: 12, label: 'color' },
    ],
  },
  {
    year: '2020',
    children: [
      { name: 'red', amount: 1, label: 'color' },
      { name: 'yellow', amount: 3, label: 'color' },
    ],
  },
]

重组数组：

[
  {
    id: 'red',
    data: [
      { year: '2019', amount: 1 },
      { year: '2020', amount: 1 },
    ],
  },
  {
    id: 'yellow',
    data: [
      { year: '2019', amount: 20 },
      { year: '2020', amount: 3 },
    ],
  },
  {
    id: 'green',
    data: [
      { year: '2019', amount: 12 },
    ],
  },
]

Answer 1

您可以使用flatMap、groupBy 和映射链接整个操作。

const entries = [{ year: '2019', children: [{ name: 'red', amount: 1, label: 'color' }, { name: 'yellow', amount: 20, label: 'color' }, { name: 'green', amount: 12, label: 'color' }] }, { year: '2020', children: [{ name: 'red', amount: 1, label: 'color' }, { name: 'yellow', amount: 3, label: 'color' }] }],
    result = _(entries)
        .flatMap(({ year, children }) => _.map(children, ({ name: id, amount }) => ({ year, id, amount })))
        .groupBy('id')
        .map((data, id) => ({ id, data: _.map(data, ({ year, amount }) => ({ year, amount })) }))
        .value();

console.log(result);

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

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

Answer 2

可能有很多不同的方法可以做到这一点，但是，我发现最好的方法是：

1. 将子元素扁平化为一个数组。
2. 使用 _.groupBy 创建以名称为关键字的这些条目的映射。
3. 使用 _.entries 获取地图的键和值数组。
4. 最后使用 _.map 将这些条目转换为我们想要的输出。

const entries = [
  {
    year: '2019',
    children: [
      { name: 'red', amount: 1, label: 'color' },
      { name: 'yellow', amount: 20, label: 'color' },
      { name: 'green', amount: 12, label: 'color' },
    ],
  },
  {
    year: '2020',
    children: [
      { name: 'red', amount: 1, label: 'color' },
      { name: 'yellow', amount: 3, label: 'color' },
    ],
  },
]

// Step 1
let flattenedChildren = _.flatMap(entries, e => e.children.map(c => { return { ...c, year: e.year } }));

// Step 2
let entryMap =  _.groupBy(flattenedChildren , "name");

// Step 3
let mapEntries = _.entries(entryMap);

// Step 4
let result = _.map(mapEntries , ([id, items]) => { return { id, data: items.map(item => _.pick(item, ["amount", "year"]))} });

console.log("Result:", result);
   

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