Javascript:从嵌套的键值对中读取键/值

Question

我正在尝试将 Category 属性作为数组从嵌套键/值 Javascript 对象输出，如下所示。

var data = [{key: "A", values:[{Category:"One", amount:2000},
    {Category: "Two", amount:2500},
    {Category: "Three", amount: 3000},
    {Category: "Four", amount: 3000}]
},
{key: "B", values:[{Category:"One", amount:2000},
    {Category: "Two", amount:2500},
    {Category: "Three", amount: 3000},
    {Category: "Four", amount: 3000}]
},
{key: "C", values:[{Category:"One", amount:2000},
    {Category: "Two", amount:2500},
    {Category: "Three", amount: 3000},
    {Category: "Four", amount: 3000}]
}]  

预期输出如下：-

["One","Two","Three","Four"]  

我尝试了几种方法来实现这一目标。
我最接近的是嵌套地图功能，如下所示。
下面的数据是包含上面 Javascript 对象的变量。

x = data.map(function(el) {return el.values.map(function(ele,i){return 
ele.Category;})})  

但输出仍然是一个数组数组，如下所示。我可以对此进行切片，然后只读取返回的数组之一，但我相信有更好的方法可以做到这一点。

[["One","Two","Three","Four"],["One","Two","Three","Four"],
["One","Two","Three","Four"]]  

任何建议将不胜感激。

Answer 1

您可以先平展返回的数组数组，然后使用 Set 删除所有重复的条目。

var data = [{key:"A",values:[{Category:"One",amount:2000},{Category:"Two",amount:2500},{Category:"Three",amount:3000},{Category:"Four",amount:3000}]},{key:"B",values:[{Category:"One",amount:2000},{Category:"Two",amount:2500},{Category:"Three",amount:3000},{Category:"Four",amount:3000}]},{key:"C",values:[{Category:"One",amount:2000},{Category:"Two",amount:2500},{Category:"Three",amount:3000},{Category:"Four",amount:3000}]}],
    x = data.map(v => v.values.map(c => c.Category)).reduce((a,b) => a.concat(b)),
    res = [...new Set(x)];
    console.log(res);

Answer 2

这里有一个不那么神秘的方法。您的设置有点有趣，因为有重复项，并且您似乎希望消除重复项。ES6套装非常适合这一点。这会为您提供所需的结果。

let data = [{key:"A",values:[{Category:"One",amount:2000},{Category:"Two",amount:2500},{Category:"Three",amount:3000},{Category:"Four",amount:3000}]},{key:"B",values:[{Category:"One",amount:2000},{Category:"Two",amount:2500},{Category:"Three",amount:3000},{Category:"Four",amount:3000}]},{key:"C",values:[{Category:"One",amount:2000},{Category:"Two",amount:2500},{Category:"Three",amount:3000},{Category:"Four",amount:3000}]}],
    set = new Set();
    data.forEach(val => {
        let v = val.values.forEach ( x => {
            set.add(x.Category);
        });
    });
    console.log(Array.from(set));

Answer 3

我使用Underscore.js。

var data = [
    {
        key: "A",
        values: [
            {Category: "One",   amount: 2000},
            {Category: "Two",   amount: 2500},
            {Category: "Three", amount: 3000},
            {Category: "Four",  amount: 3000}
        ]
    },
    ...
];
var categories =
  _.unique(
    _.flatten(
      _.map(data, function (item) {
        return _.pluck(item.values, 'Category');
      })
    )
  );

Answer 4

var data = [{key: "A", values:[{Category:"One", amount:2000},
    {Category: "Two", amount:2500},
    {Category: "Three", amount: 3000},
    {Category: "Four", amount: 3000}]
},
{key: "B", values:[{Category:"One", amount:2000},
    {Category: "Two", amount:2500},
    {Category: "Three", amount: 3000},
    {Category: "Four", amount: 3000}]
},
{key: "C", values:[{Category:"One", amount:2000},
    {Category: "Two", amount:2500},
    {Category: "Three", amount: 3000},
    {Category: "Four", amount: 3000}]
}
];
var ans = data.reduce(function(acc, el) {
    return acc.concat(el.values.map(x => x.Category));
}, [])
var result = [...new Set(ans)]
console.log(result);