通过 Lodash 从数组创建对象映射答案

【问题标题】：Create a Map of Objects from an Array via Lodash通过 Lodash 从数组创建对象映射
【发布时间】：2018-04-23 15:23:21
【问题描述】：

我有以下由name、age 和department 组成的数组

[[ "Kevin", 22,"Psychology" ],
[ "Cathy", 26, "Psychology" ],
[ "David", 31, "Engineering" ],
[ "Christine", 23, "Engineering" ]]

我想根据唯一的departments 创建一个如下所示的地图：

{ Psychology: [ 
  { name: "Cathy", age: 26 }, 
  { name: "Kevin", age: 22 } ] 
},
{ Engineering: [ 
  { name: "Christine", age: 23 }, 
  { name: "David", age: 31 } ] 
}

department 在数组中的索引将始终相同。如何使用lodash 来做到这一点？

【问题讨论】：

标签： javascript lodash

【解决方案1】：

在不使用外部库的情况下，使用类似这样的新 ESNext 非常容易。

const data = [
[ "Kevin", 22,"Psychology" ],
[ "Cathy", 26, "Psychology" ],
[ "David", 31, "Engineering" ],
[ "Christine", 23, "Engineering" ]];

const result = data.reduce((a, v) => {
  const [name,age,dept] = v; 
  (a[dept] = a[dept] || []).push({name,age});
  return a;
}, {});

console.log(result);

【讨论】：

这太棒了！不幸的是，我被 IE 卡住了，无法集成 Babel 来转换这个脚本（这就是我引入 lodash 的原因）。没听说过这个 ESNext，我去看看
幸运的是 Babel 有一个 es5 转换器！我会试一试告诉你babeljs.io
EsNext 只是现代 Javascript 的另一种说法，我不记得某个功能是在 2015 年、2017 年等出现的，所以我只说 EsNext。 :) This is fantastic! Unfortunately I'm stuck with IE，这不是问题，任何认真的 JS 开发人员都会有某种形式的构建过程。 webpackwebpack.js.org 是一个不错的选择，如果您目前不这样做的话。
这看起来并没有使用任何特别现代的东西。它应该适用于最新的 IE，甚至一些较旧的 IE。
@ScottSauyet 这里没有做太多测试，但是这个 sn-p 在 IE11 上失败了。很可能是因为对象简写{name,age} 和数组解构[name,age,dept] = v

【解决方案2】：

这是一个 lodash 解决方案：

const {flow, groupBy, nth, mapValues, map, zipObject} = _

const transform = flow(
  people => groupBy(people, p => nth(p, 2)),
  grouped => mapValues(grouped, dept => map(
    dept, 
    person => zipObject(['name', 'age'], person)
  ))
)

const people = [["Kevin", 22, "Psychology"], ["Cathy", 26, "Psychology"], ["David", 31, "Engineering"], ["Christine", 23, "Engineering"]]

console.log(transform(people))

&lt;script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js"&gt;&lt;/script&gt;

使用 lodash/fp 可能会更简单，但我从来没有让它正常工作。我可能没有花太多时间在这上面，因为我是另一个用于 JS 的 FP 库的作者之一，Ramda。上面的解决方案是通过翻译我用 Ramda 编写的第一个代码创建的：

const {pipe, groupBy, nth, map, zipObj} = R;

const transform = pipe(
  groupBy(nth(2)),
  map(map(zipObj(['name', 'age'])))
)

const people = [["Kevin", 22, "Psychology"], ["Cathy", 26, "Psychology"], ["David", 31, "Engineering"], ["Christine", 23, "Engineering"]]

console.log(transform(people))

&lt;script src="//cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.js"&gt;&lt;/script&gt;

我猜 lodash/fp 代码可能看起来很相似，只是您必须将第一个 map 替换为 mapValues。

【讨论】：