递归搜索并推入复杂的数组/对象

时间:2018-02-20 07:23:45

标签: javascript angular typescript lodash

我把这个plunker https://plnkr.co/edit/CIGAA5BmiKU4hCMsOaIB?p=preview作为参考,但现在我需要动态数组操作

[
{
    title: 'Menu 1',
    id :1,
    hide : true,
    children: [],
},
{
    title: 'Menu 2',
    hide : true,
    id :2,
    children: [{
        title: 'Sub Menu 2',
        hide : true,
        id :3,
        children: [{
            title: 'Sub Sub Menu 2',
            hide : true,
            id :4,
            children: [{
                title: 'Sub Sub Menu 2, Sibling 1',
                hide : true,
                id :6,
                children: []
            },
            {
                title: 'Sub Sub Sub Menu 2, Sibling 2',
                hide : true,
                id :12,
                children: []
            }]
        }]
    }]

},
{
    title: 'Menu 3',
    hide : true,
    id :14,
    children: []
}
]; 

现在我必须在具有id为6的对象中推送子项,并且在每次操作后都需要更新整个对象。

我正在使用angular 5

我使用了以下方法

find(id, items,newData) {
  var i = 0, found;
  for (; i < items.length; i++) {
    if (items[i].id === id) {
      items[i].children=newData;
      return items;
} else if (_.isArray(items[i].children)) {
  found = this.find(id, items[i].children,newData);
  if (found) {
    return false;

      }
    }
  }
}

这里基本上newData是我需要推送的数组, items是我的主要对象,应该在推送后更新

如果某个地方我错了,请纠正我。如果有ID 3的元素有孩子有id 4.所以现在如果它不应该被推入相同的父ID。

所有对象都具有相同的结构,如newData也有子项

2 个答案:

答案 0 :(得分:0)

创建&amp;使用递归函数

&#13;
&#13;
var arr = [{
  title: 'Menu 1',
  id: 1,
  hide: true,
  children: [],
}, {
  title: 'Menu 2',
  hide: true,
  id: 2,
  children: [{
    title: 'Sub Menu 2',
    hide: true,
    id: 3,
    children: [{
      title: 'Sub Sub Menu 2',
      hide: true,
      id: 4,
      children: [{
        title: 'Sub Sub Menu 2, Sibling 1',
        hide: true,
        id: 6,
        children: [{
          title: 'Sub Sub Menu 2, Sibling 1',
          hide: true,
          id: 7,
          children: []
        }]
      }, {
        title: 'Sub Sub Sub Menu 2, Sibling 2',
        hide: true,
        id: 12,
        children: []
      }]
    }]
  }]
}, {
  title: 'Menu 3',
  hide: true,
  id: 14,
  children: []
}];

// a recursive function which accepts an array and the id , this id will be use to target the children of the object whose id matches
// looping through the array & checking if id matches
function findUpdate(array, id) {
  array.forEach(function(elem) {
    if (elem.id === id) {
      // push value to children of that object
      elem.children.push("pushed")
    } else {
       //check if children is an array and if it is empty
      if (Array.isArray(elem.children) && elem.children.length > 0) {
        //call the same function with the new arra
        findUpdate(elem.children, id)
      }
    }
  });

  console.log(arr)
}

console.log(findUpdate(arr, 12))
&#13;
&#13;
&#13;

答案 1 :(得分:0)

您将返回false而不是item.You要替换或推送。

&#13;
&#13;
var id = 6;
var items = [{
        title: 'Menu 1',
        id: 1,
        hide: true,
        children: [],
    },
    {
        title: 'Menu 2',
        hide: true,
        id: 2,
        children: [{
            title: 'Sub Menu 2',
            hide: true,
            id: 3,
            children: [{
                title: 'Sub Sub Menu 2',
                hide: true,
                id: 4,
                children: [{
                        title: 'Sub Sub Menu 2, Sibling 1',
                        hide: true,
                        id: 6,
                        children: [{
                            title: 'Sub Sub Menu 2, Sibling 1',
                            hide: true,
                            id: 7,
                            children: []
                        }]
                    },
                    {
                        title: 'Sub Sub Sub Menu 2, Sibling 2',
                        hide: true,
                        id: 12,
                        children: []
                    }
                ]
            }]
        }]

    },
    {
        title: 'Menu 3',
        hide: true,
        id: 14,
        children: []
    }
];
var newData = [{
    title: 'new Data'
}]
var find = (id, items, newData) => {
    var i = 0,
        found;
    for (; i < items.length; i++) {
        if (items[i].id === id) {
            items[i].children.push(newData); //change here if you want add in existing array
            return items;
        } else if (items[i].children.length != 0) {
            found = this.find(id, items[i].children, newData);
            if (found) {
                return items;
            }
        }
    }
    return items;
}

console.log(find(id, items, newData))
&#13;
&#13;
&#13;