将数组转换为具有childs的对象

时间:2016-02-15 18:46:21

标签: javascript arrays angularjs

我有一个包含element idelement parent字段的数组如下:

[
  { id: 1, parent: 0 },
  { id: 2, parent: 0 },
  { id: 3, parent: 0 },
  { id: 4, parent: 3 },
  { id: 5, parent: 3 },
  { id: 6, parent: 5 },
  { id: 7, parent: 6 },
]

我想像这样隐藏这个数组:

[
  { id: 1, childs: null },
  { id: 2, childs: null },
  { id: 3, childs:
    [
      { id: 4, childs: null },
      { id: 5, childs: 
        [
          { id: 6, childs: 
            [
              { id: 7, childs: null }
            ] // 6 .childs
          }, // 6
        ] // 5.childs
      }, // 5
    ] // 3.childs
  }, // 3
]

换句话说,将第一个数组视为注释列表,我想使用Angular的ng-repeat指令和嵌套的ng-repeats来显示主题,以显示子注释。

那么如何以正确的方式将第一个数组转换为第二个数组并获得良好的性能呢?

1 个答案:

答案 0 :(得分:2)

干净的方法是使用map / reduce。

var array = [
  { id: 1, parent: 0 },
  { id: 2, parent: 0 },
  { id: 3, parent: 0 },
  { id: 4, parent: 3 },
  { id: 5, parent: 3 },
  { id: 6, parent: 5 },
  { id: 7, parent: 6 },
];

array.map(function(el){
  el.children = array.filter(function(item){
    return item.parent === el.id
  });
  return el;
}).filter(function(item){
  return item.parent === 0;
})

结果是:

[
   {
      "id":1,
      "parent":0,
      "children":[

      ]
   },
   {
      "id":2,
      "parent":0,
      "children":[

      ]
   },
   {
      "id":3,
      "parent":0,
      "children":[
         {
            "id":4,
            "parent":3,
            "children":[

            ]
         },
         {
            "id":5,
            "parent":3,
            "children":[
               {
                  "id":6,
                  "parent":5,
                  "children":[
                     {
                        "id":7,
                        "parent":6,
                        "children":[

                        ]
                     }
                  ]
               }
            ]
         }
      ]
   }
]

过滤您需要的属性取决于您,这可以通过再次映射这些元素轻松完成:)

P.S。:就渐近复杂性而言,这不是最佳解决方案,但它简洁而优雅。

相关问题