Javascript父子树合并

时间:2016-03-09 04:26:19

标签: javascript arrays tree underscore.js parent-child

以下是三个数组,我想使用mergelist函数合并它们。 我是javascript的新手,请帮帮我。

var list1 = [
    {name: 'Parent'},
    {name: 'child1', parent: ‘parent’},
    {name: 'child2', parent: ‘parent’},
    {name: 'child21', parent: 'child2'}
];

var list2 = [
    {name: 'child1'},
    {name: 'child11', parent: 'child1'},
    {name: 'child12', parent: 'child1'}
];

var list3 = [
    {name: 'child2'},
    {name: 'child22', parent: 'child2'},
    {name: 'child23', parent: 'child2'}
];

实现一个将数组中所有树合并为一个组合树的函数。

请帮我解释一下代码。谢谢 我尝试过这段代码,但我只能为2棵树而不是我想要的。

var list1 = [
    {
        Parent: 'parent',
        children: [
            {
                parent: 'child1',
                children: []
            },
            {
                parent: 'child2',
                children: [
                  {
                    parent:'child21',
                    children :[]
                  }]
            }]
    }
];

var list2 = [
    {
        parent: 'child1',
        children: [
            {
                parent: 'child11',
                children: []
            },
            {
                parent: 'child12',
                children: []
            }]
    }
];

var list3 = [
  {
        parent: 'child2',
        children: [
            {
                parent: 'child22',
                children: []
            },
            {
                parent: 'child23',
                children: []
            }]
    }
]
var addNode = function(nodeId, array) {
  array.push({parent: nodeId, children: []});
};

var placeNodeInTree = function(nodeId, parent, treeList) {
  return treeList.some(function(currentNode){

    // If currentNode has the same id as the node we want to insert, good! Required for root nodes.
    if(currentNode.parent === nodeId) {
      return true;  
    }

    // Is currentNode the parent of the node we want to insert?
    if(currentNode.parent === parent) {

      // If the element does not exist as child of currentNode, create it
      if(!currentNode.children.some(function(currentChild) {
        return currentChild.parent === nodeId;
      })) addNode(nodeId, currentNode.children);

      return true;
    } else {

      // Continue looking further down the tree
      return placeNodeInTree(nodeId, parent, currentNode.children);
    }
  });
};

var mergeInto = function(tree, mergeTarget, parentId) {
  parentId = parentId || undefined;
  tree.forEach(function(node) {

    // If parent has not been found, placeNodeInTree() returns false --> insert as root element
    if(!placeNodeInTree(node.parent, parentId, mergeTarget)){
      list1.push({parent: node.parent, children:[]});
    }

    mergeInto(node.children, mergeTarget, node.parent);

  });
};

mergeInto(list2, list1);

document.write('<pre>');
document.write(JSON.stringify(list1, null, 4));
console.log(list1);
document.write('</pre>');

1 个答案:

答案 0 :(得分:0)

这看起来像一个简单的问题,但数据源误导了重复项目,有时使用父属性,有时没有。

第一部分是清理数据并使用单个名称构建一个平面数组,如果可能,使用父级。数据存储在data中。第一个输出就是这个结果。

第二部分是用数据构建一棵树。对于每个对象,构建name的节点,并且对于每个给定的parent,创建一个节点(如果它还没有)。

&#13;
&#13;
var list1 = [{ name: 'parent' }, { name: 'child1', parent: 'parent' }, { name: 'child2', parent: 'parent' }, { name: 'child21', parent: 'child2' }],
    list2 = [{ name: 'child1' }, { name: 'child11', parent: 'child1' }, { name: 'child12', parent: 'child1' }],
    list3 = [{ name: 'child2' }, { name: 'child22', parent: 'child2' }, { name: 'child23', parent: 'child2' }],
    data = function (data) {
        var o = {}, r = [];
        data.forEach(function (a) {
            if (!o[a.name]) {
                r.push(a);
                o[a.name] = a;
                return;
            } 
            if (!(parent in o[a.name])) {
                o[a.name] = a;
            }
        });
        return r;
    }([].concat(list1, list2, list3)),
    tree = function (data) {
        var r, o = {};
        document.write('<pre>data: ' + JSON.stringify(data, 0, 4) + '</pre>');
        data.forEach(function (a, i) {
            a.children = o[a.name] && o[a.name].children;
            o[a.name] = a;
            if (a.parent === undefined) {
                r = a;
                return;
            }
            o[a.parent] = o[a.parent] || {};
            o[a.parent].children = o[a.parent].children || [];
            o[a.parent].children.push(a);
        });
        return r;
    }(data);

document.write('<pre>tree: ' + JSON.stringify(tree, 0, 4) + '</pre>');
&#13;
&#13;
&#13;