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"}]}]}]}]}]
  • 相关阅读:
    android -- eclipse 环境搭建
    android AVD坑(1) -- no images system installed for this target
    android AVD坑(1) -- no images system installed for this target
    简单的轮播
    C# 使用NPOI 处理Excel(Datable与Excel相互转换)
    C盘突然爆满
    IIS中 flv、swf 文件无法播放
    webservice 尝试加载 Oracle 客户端库时引发 BadImageFormatException。如果在安装 32 位 Oracle 客户端组件的情况下运行,将出现此问题
    window server 2008 安装Oracle10g
    ora-01033 oracle initialization or
  • 原文地址:https://www.cnblogs.com/Charles-Yuan/p/12398632.html
Copyright © 2011-2022 走看看