收藏深处的地图答案

【问题标题】：map deep in collection收藏深处的地图
【发布时间】：2017-10-18 00:53:32
【问题描述】：

我需要获取我拥有的一个大集合的所有“id”和“name”。一个数组 ob 对象，它具有包含对象（等）的数组。

如果不手动为尽可能多的级别进行 foreaches，我无法让它工作，这很丑。

我正在使用 Lodash，所以使用它的解决方案会很不错。

这就是集合的样子：

[
  {
    "id": 1,
    "name": "Living",
    "numberStories": 0,
    "subcategories": {
      "data": [
        {
          "id": 2,
          "name": "Fashion",
          "numberStories": 0,
          "subcategories": {
            "data": [
              {
                "id": 3,
                "name": "Accessories",
                "numberStories": 0,
                "subcategories": {
                  "data": [

                  ]
                }
              },
              {
                "id": 4,
                "name": "Kid's Fashion",
                "numberStories": 0,
                "subcategories": {
                  "data": [

                  ]
                }
              }, (... etc)

所以它需要查看每个对象数组中的子类别并收集 id 和 name，以便我最终得到所有级别的所有 id 名称。

谢谢。

【问题讨论】：

标签： javascript reduce flatten

【解决方案1】：

没有必要为此使用 lodash。使用.reduce() 的简单递归函数可以为您完成这项工作

function flattenId(inArray){
 return inArray.reduce(function(output, elem){
   output.push(elem.id);
   return output.concat(flattenId(elem.subcategories.data));
  }, []);
}

【讨论】：

【解决方案2】：

如上所述，这可能更容易使用原生 javascript，因为它是递归的。这与上一个答案的想法相同，但使用了 ES6 的一些很酷的特性（解构、剩余参数、箭头函数、默认参数），并且它将保存对父 id 的引用，以便您可以在需要时重建类别树.

const categories=[{id:1,name:"Living",numberStories:0,subcategories:{data:[{id:2,name:"Fashion",numberStories:0,subcategories:{data:[{id:3,name:"Accessories",numberStories:0,subcategories:{data:[]}},{id:4,name:"Kid's Fashion",numberStories:0,subcategories:{data:[]}}]}}]}}];

const flattenCategories = (categories, parent = null, ret = []) =>
  categories.reduce((acc, { id, name, subcategories: { data } }) =>
    acc.concat(
      { id, name, parent },
      ...flattenCategories(data, id)
    )
  , ret)


console.log(
  flattenCategories(categories)
)

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

【讨论】：

【解决方案3】：

这是使用object-scan 的解决方案。根据您的用例，使用库可能有点矫枉过正，但如果需要，它可以为您提供更多的灵活性

// const objectScan = require('object-scan');

const categories = [{ id: 1, name: 'Living', numberStories: 0, subcategories: { data: [{ id: 2, name: 'Fashion', numberStories: 0, subcategories: { data: [{ id: 3, name: 'Accessories', numberStories: 0, subcategories: { data: [] } }, { id: 4, name: "Kid's Fashion", numberStories: 0, subcategories: { data: [] } }] } }] } }];

const r = objectScan(['**[*].id'], {
  filterFn: ({ context, value, parents }) => {
    context.push({
      id: value,
      name: parents[0].name,
      parent: parents.length > 2 ? parents[3].id : null
    });
  }
})(categories, []);

console.log(r);
// => [ { id: 4, name: "Kid's Fashion", parent: 2 }, { id: 3, name: 'Accessories', parent: 2 }, { id: 2, name: 'Fashion', parent: 1 }, { id: 1, name: 'Living', parent: null } ]

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

&lt;script src="https://bundle.run/object-scan@13.8.0"&gt;&lt;/script&gt;

免责声明：我是object-scan的作者

【讨论】：