zoukankan      html  css  js  c++  java
  • JS数组 父子关系 生成 对象

    JS数组 父子关系 生成 对象

    JS数组(父子关系)数据如下:

    var data = [{"id":"1","parentId":"0","name":"主目录"},
    {"id":"2","parentId":"1","name":"1级目录:2"},
    {"id":"3","parentId":"1","name":"1级目录:3"},
    {"id":"4","parentId":"2","name":"2级目录:4"},
    {"id":"5","parentId":"3","name":"2级目录:5"},
    {"id":"6","parentId":"3","name":"2级目录:6"},
    {"id":"7","parentId":"6","name":"3级目录:7"},
    {"id":"8","parentId":"7","name":"4级目录:8"},
    {"id":"9","parentId":"5","name":"3级目录:9"},
    {"id":"10","parentId":"9","name":"4级目录:10"}
    ]; 

    JS数组 ID关系图,如下:

    |-0
      |-2
        |-4
    
      |-3
        |-5
          |-9
            |-10
        |-6
          |-7
            |-8

    JS 转换代码:

    var getJsonTree=function(data,parentId){
            var itemArr=[];
            for(var i=0;i<data.length;i++){ 
                var node=data[i];
                //data.splice(i, 1)
                 if(node.parentId==parentId ){ 
                    var newNode={id:node.id,title:node.name,nodes:getJsonTree(data,node.id)};
                    itemArr.push(newNode);              
                 }
            }
            return itemArr;
        }  

    使用方法:

    var jsonArray = getJsonTree(data,'0');
    console.log(jsonArray);

    这是输出结果.

    [{"id":"1","title":"主目录","nodes":[{"id":"2","title":"1级目录:2","nodes":[{"id":"4","title":"2级目录:4","nodes":[]}]},{"id":"3","title":"1级目录:3","nodes":[{"id":"5","title":"2级目录:5","nodes":[{"id":"9","title":"3级目录:9","nodes":[{"id":"10","title":"4级目录:10","nodes":[]}]}]},{"id":"6","title":"2级目录:6","nodes":[{"id":"7","title":"3级目录:7","nodes":[{"id":"8","title":"4级目录:8","nodes":[]}]}]}]}]}]

    <注意:上面的输出中,即使nodes为空数组,也将该属性输出了,如果nodes为空,不进行输出,使用下面代码.>

    下面的代码做了判断,如果数组为空,将不给对象添加nodes属性

                var getJsonTree=function(data,parentId){
                        var itemArr=[];
                        for(var i=0;i<data.length;i++){ 
                            var node=data[i];
                            //data.splice(i, 1)
                             if(node.parentId==parentId ){ 
                                var newNode={id:node.id,title:node.name};
                                var result = getJsonTree(data,node.id);
                                if(result.length > 0) {
                                    newNode['nodes'] = result
                                }
                                itemArr.push(newNode);              
                             }
                        }
                        return itemArr;
                    }  

    输出结果:

    [{"id":"1","title":"主目录","nodes":[{"id":"2","title":"1级目录:2","nodes":[{"id":"4","title":"2级目录:4"}]},{"id":"3","title":"1级目录:3","nodes":[{"id":"5","title":"2级目录:5","nodes":[{"id":"9","title":"3级目录:9","nodes":[{"id":"10","title":"4级目录:10"}]}]},{"id":"6","title":"2级目录:6","nodes":[{"id":"7","title":"3级目录:7","nodes":[{"id":"8","title":"4级目录:8"}]}]}]}]}]
  • 相关阅读:
    Intersection of Two Linked Lists
    Tools:实现vmware虚拟机开机自启动
    Tools:实现ping操作带时间戳【windows+linux】
    Django:学习笔记
    Python:笔记2
    Python:笔记1_字符串处理【转载】
    Pycharm:使用笔记
    python:win下将py文件打包成exe
    python:选房抽签小工具
    RF:操作笔记
  • 原文地址:https://www.cnblogs.com/Charles-Yuan/p/12398632.html
Copyright © 2011-2022 走看看