使用 lodash 从对象属性和值的集合创建两个数组答案

【问题标题】：Create two arrays from a collection of object property and values with lodash使用 lodash 从对象属性和值的集合创建两个数组
【发布时间】：2015-04-27 21:49:47
【问题描述】：

我有一个包含对象的数组，如下所示：

[{
 "first" : 1
},
{
 "second" : 2
},
{
 "third" : 3
}]

我想把这个变成两个数组，索引根据这些值进行匹配，比如：

["first","second","third"]
[1,2,3]

我可以遍历它并获取对象的键和值，但我觉得在 lodash 中必须有一种巧妙的方式来做到这一点，我不知道。有什么建议么？谢谢！

【问题讨论】：

数组中的每一项都是不同的形状。我怀疑如果您正在执行此类操作，则不同的结构会更好地满足您的需求。例如，元组数组可能更好：[['first', 1], ['second', 2], ['third', 3]]
嗯，这是一个图表库，它使用这种结构来存储标签和数据。

标签： javascript arrays javascript-objects lodash

【解决方案1】：

您似乎只需要映射对象并调用keys() 和values()

你会得到第一个数组：

var items = [{a: "1"},{b: "blah",c: "what"},{d: "3"}]
keys = _(items).map(_.keys).flatten().value()

返回["a","b","c","d"]

第二个数组像：

values = _(items).map(_.values).flatten().value()

返回["1","blah","what","3"]

【讨论】：

【解决方案2】：

对于非 lodash 解决方案：

var arr = [{"first" : 1},{"second" : 2},{"third" : 3}];
var keys = arr.map(function(el){return Object.keys(el)[0];});
var vals = arr.map(function(el){return el[Object.keys(el)[0]];});

对于相反的问题（多个数组变成一个对象数组），请参阅Merge two arrays into an array of objects with property values

【讨论】：

【解决方案3】：

假设你的对象形状总是{"label": value}，那么你可以使用这个vanilla JavaScript：

var data = [{"first" : 1},{"second" : 2},{"third" : 3}];
var labels = data.map(function(entry) {
    return Object.keys(entry)[0];
});
var values = data.map(function(entry) {
    return entry[Object.keys(entry)[0]];
});

根据您的 cmets，您的数据结构似乎不是最理想的。我会推荐一个替代结构：

var data = [
    {'label': 'first', 'value': 1},
    {'label': 'second', 'value': 2},
    {'label': 'third', 'value': 3}
]

然后在普通 JavaScript 中将标签和值分成单独的部分是微不足道的：

var labels = data.map(function(entry) {
    return entry.label;
});
var values = data.map(function(entry) {
    return entry.value;
});

或者如果你真的想使用 lodash：

var labels = _.pluck(data, 'label');
var values = _.pluck(data, 'value');

希望您可以看到，无论您是否使用 lodash，这个修改后的结构都让 JavaScript 变得更加简单。

【讨论】：