树形结构的数据与一维数组数据的相互转换

数组转树形结构

var data = [
              {"id":2,"name":"第一级1","pid":0},
              {"id":3,"name":"第二级1","pid":2},
              {"id":5,"name":"第三级1","pid":4},
              {"id":100,"name":"第三级2","pid":3},
              {"id":6,"name":"第三级2","pid":3},
              {"id":601,"name":"第三级2","pid":6},
              {"id":602,"name":"第三级2","pid":6},
              {"id":603,"name":"第三级2","pid":6}
            ];
// 数组转树形结构数据（原理即为通过设置id为key值，再通过pid去找这个key是否一样，一样则为这数据的子级数据）
            function arrayToJson(treeArray){
                var r = [];
                var tmpMap ={};
                for (var i=0, l=treeArray.length; i<l; i++) {
                 // 以每条数据的id作为obj的key值，数据作为value值存入到一个临时对象里面
                  tmpMap[treeArray[i]["id"]]= treeArray[i]; 
                } 
                console.log('tmpMap',tmpMap)
                for (i=0, l=treeArray.length; i<l; i++) {
                  var key=tmpMap[treeArray[i]["pid"]];
                  console.log('key',key)
                  //循环每一条数据的pid，假如这个临时对象有这个key值，就代表这个key对应的数据有children，需要Push进去
                  //如果这一项数据属于哪个数据的子级
                  if (key) {
                      // 如果这个数据没有children
                    if (!key["children"]){
                        key["children"] = [];
                        key["children"].push(treeArray[i]);
                    // 如果这个数据有children
                    }else{
                      key["children"].push(treeArray[i]);
                    }       
                  } else {
                    //如果没有这个Key值，就代表找不到属于哪个数据，那就代表没有父级,直接放在最外层
                    r.push(treeArray[i]);
                  }
                }
                return r
               }

树形结构数据转单层数组形式数据

var jsonarr = [{
                id: 1,
                name: '北京市',
                ProSort: 1,
                remark: '直辖市',
                pid: '',
                isEdit: false,
                children: [{
                  id: 35,
                  name: '朝阳区',
                  pid: 1,
                  remark: '',
                  isEdit: false,
                  children: []
                }, {
                  id: 36,
                  name: '海淀区',
                  pid: 1,
                  remark: '',
                  isEdit: false,
                  children: []
                }, {
                  id: 37,
                  name: '房山区',
                  pid: 1,
                  remark: '',
                  isEdit: false,
                  children: []
                }, {
                  id: 38,
                  name: '丰台区',
                  pid: 1,
                  remark: '',
                  isEdit: false,
                  children: []
                }]
              }, {
                id: 2,
                name: '天津市',
                ProSort: 2,
                remark: '直辖市',
                pid: '',
                isEdit: false,
                children: [{
                  id: 41,
                  name: '北辰区',
                  pid: 2,
                  remark: '',
                  isEdit: false,
                  children: [{
                  id: 113,
                  name: '天津大道',
                  ProSort: 2,
                  remark: '道路',
                  pid: '',
                  isEdit: false,
                  children:[]}]
                }, {
                  id: 42,
                  name: '河北区',
                  pid: 2,
                  remark: '',
                  isEdit: false,
                  children: []
                }, {
                  id: 43,
                  name: '西青区',
                  pid: 2,
                  remark: '',
                  isEdit: false,
                  children: []
                }]
              }, {
                id: 3,
                name: '河北省',
                ProSort: 5,
                remark: '省份',
                pid: '',
                isEdit: false,
                children: [{
                  id: 45,
                  name: '衡水市',
                  pid: 3,
                  remark: '',
                  isEdit: false,
                  children: []
                }, {
                  id: 46,
                  name: '张家口市',
                  pid: 3,
                  remark: '',
                  isEdit: false,
                  children: []
                }]
              }]
// 树形结构数据转单层数组形式
            function jsonToArray(nodes) {
              var r=[];
              if (Array.isArray(nodes)) {
                for (var i=0, l=nodes.length; i<l; i++) {
                  r.push(nodes[i]); // 取每项数据放入一个新数组
                  if (Array.isArray(nodes[i]["children"])&&nodes[i]["children"].length>0)
                   // 若存在children则递归调用，把数据拼接到新数组中，并且删除该children
                    r = r.concat(jsonToArray(nodes[i]["children"]));
                      delete nodes[i]["children"]
                }
              } 
              return r;
            }

深拷贝

function deepCopy(obj){
                var object;
                // 深度复制数组
                if(Object.prototype.toString.call(obj)=="[object Array]"){    
                  object=[];
                  for(var i=0;i<obj.length;i++){
                    object.push(deepCopy(obj[i]))
                  }   
                  return object
                }
              // 深度复制对象
                if(Object.prototype.toString.call(obj)=="[object Object]"){   
                  object={};
                  for(var p in obj){
                    object[p]=obj[p]
                  }   
                  return object
                }
              }

1. var jsonarr = [{
2.  
   id: 1,
3.  
   name: '北京市',
4.  
   ProSort: 1,
5.  
   remark: '直辖市',
6.  
   pid: '',
7.  
   isEdit: false,
8.  
   children: [{
9.  
   id: 35,
10.  
    name: '朝阳区',
11.  
    pid: 1,
12.  
    remark: '',
13.  
    isEdit: false,
14.  
    children: []
15.  
    }, {
16.  
    id: 36,
17.  
    name: '海淀区',
18.  
    pid: 1,
19.  
    remark: '',
20.  
    isEdit: false,
21.  
    children: []
22.  
    }, {
23.  
    id: 37,
24.  
    name: '房山区',
25.  
    pid: 1,
26.  
    remark: '',
27.  
    isEdit: false,
28.  
    children: []
29.  
    }, {
30.  
    id: 38,
31.  
    name: '丰台区',
32.  
    pid: 1,
33.  
    remark: '',
34.  
    isEdit: false,
35.  
    children: []
36.  
    }]
37.  
    }, {
38.  
    id: 2,
39.  
    name: '天津市',
40.  
    ProSort: 2,
41.  
    remark: '直辖市',
42.  
    pid: '',
43.  
    isEdit: false,
44.  
    children: [{
45.  
    id: 41,
46.  
    name: '北辰区',
47.  
    pid: 2,
48.  
    remark: '',
49.  
    isEdit: false,
50.  
    children: [{
51.  
    id: 113,
52.  
    name: '天津大道',
53.  
    ProSort: 2,
54.  
    remark: '道路',
55.  
    pid: '',
56.  
    isEdit: false,
57.  
    children:[]}]
58.  
    }, {
59.  
    id: 42,
60.  
    name: '河北区',
61.  
    pid: 2,
62.  
    remark: '',
63.  
    isEdit: false,
64.  
    children: []
65.  
    }, {
66.  
    id: 43,
67.  
    name: '西青区',
68.  
    pid: 2,
69.  
    remark: '',
70.  
    isEdit: false,
71.  
    children: []
72.  
    }]
73.  
    }, {
74.  
    id: 3,
75.  
    name: '河北省',
76.  
    ProSort: 5,
77.  
    remark: '省份',
78.  
    pid: '',
79.  
    isEdit: false,
80.  
    children: [{
81.  
    id: 45,
82.  
    name: '衡水市',
83.  
    pid: 3,
84.  
    remark: '',
85.  
    isEdit: false,
86.  
    children: []
87.  
    }, {
88.  
    id: 46,
89.  
    name: '张家口市',
90.  
    pid: 3,
91.  
    remark: '',
92.  
    isEdit: false,
93.  
    children: []
94.  
    }]
95.  
    }]
96.  
    // 树形结构数据转单层数组形式
97.  
    function jsonToArray(nodes) {
98.  
    var r=[];
99.  
    if (Array.isArray(nodes)) {
100.  
     for (var i=0, l=nodes.length; i<l; i++) {
101.  
     r.push(nodes[i]); // 取每项数据放入一个新数组
102.  
     if (Array.isArray(nodes[i]["children"])&&nodes[i]["children"].length>0)
103.  
     // 若存在children则递归调用，把数据拼接到新数组中，并且删除该children
104.  
     r = r.concat(jsonToArray(nodes[i]["children"]));
105.  
     delete nodes[i]["children"]
106.  
     }
107.  
     }
108.  
     return r;
109.  
     }