映射后连接嵌套数组

Question

我有一个包含多个类别对象的数组,每个类别对象都有一个items包含项目对象数组的属性.我想将每个类别中的每个项目映射到具有属性值和标签的对象[].出于某种原因,我无法执行连接.

var categories = [{
                name: "category1",
                items: [{
                    itemId: 1,
                    name: "Item1"
                }, {
                    itemId: 2,
                    name: "Item2"
                }]
            }, {
                name: "category2",
                items: [{
                    itemId: 3,
                    name: "Item3"
                }, {
                    itemId: 4,
                    name: "Item4"
                }]
            }];

var items = [];
for(var i = 0; i < categories.length; i++){
    items.concat($.map(categories[i].items,function(elem){
        return {value:elem.itemId, label:elem.name};
    }));
} 
console.log(items); //prints []

预期结果

[{
   label: "Item1",
   value: "1"
},
{
   label: "Item2",
   value: "2"
},{
   label: "Item3",
   value: "3"
},{
   label: "Item4",
   value: "4"
}

我觉得好像缺少一些非常基本的东西.我记录了该$.map函数的结果,它似乎正在返回一个[].任何人都可以找出问题吗？

JSFiddle: http ://jsfiddle.net/vymJv/

Answer 1

使用直接Javascript的另一种方法:

var x = categories.map(function(val) {
  return val.items;
}).reduce(function(pre, cur) {
   return pre.concat(cur);
}).map(function(e,i) {
  return {label:e.name,value:e.itemId};
});

输出: x = [{label: "Item1", value: 1}, {label: "Item2", value: 2}, …]

Answer 2

更新为flatMap（不兼容 IE）

categories.flatMap((categories) => categories.items)

flatMap() 方法返回一个新数组，该数组通过将给定的回调函数应用于数组的每个元素，然后将结果展平一级而形成。

Answer 3

concat()方法用于连接两个或多个数组.

此方法不会更改现有数组,但会返回一个新数组,其中包含已连接数组的值.

http://jsfiddle.net/vymJv/1/

for(var i = 0; i < categories.length; i++){
    items = items.concat($.map(categories[i].items, function(elem) {
        return {value: elem.itemId, label: elem.name};
    }));
}