您的位置:首页 > Web前端 > JavaScript

js笔记2-树形结构

2017-11-27 11:39 309 查看

树型结构

数型结构就是要做成一个像书的目录那样,一层一层的。

(之前上课的一道题)比如:定义一个树形结构描述(中国(湖北(武汉,荆州),广东(广州,惠州),广西(南宁柳州)));

简单

var china = {}
undefined
china.name = '中国';china.nodes=[];china.nodes.push({name:'湖北'});china.nodes.push({name:'广东'});china.nodes.push({name:'广西'});
3
china.nodes[0].nodes=[]
china.nodes[0].nodes.push({name:'武汉'});china.nodes[0].nodes.push({name:'荆州'});
china.nodes[1].nodes=[]
china.nodes[1].nodes.push({name:'广州'});china.nodes[1].nodes.push({name:'惠州'});
china.nodes[2].nodes=[]
china.nodes[2].nodes.push({name:'南宁'});china.nodes[2].nodes.push({name:'柳州'});


用个循环

idnamepid
1中国-1
2湖北1
3广东1
4广西1
5武汉2
6荆州2
7广州3
8惠州3
9南宁4
10柳州4
id是name的唯一标识,pid是id的上一级

算法如下

1.先将数据都放到数组中

var dq = [[1,"中国"],[2,"湖北",1],[3,"广东",1],[4,"广西",1],...[5,"武汉",2],[6,"荆州",2],[7,"广州",3],[8,"惠州",3],[9,"南宁",4],[10,"柳州",4] ]


2.以id,name将pid添加到dqk

//dqk存储上述表
var dqk=[]
for(var i in dq){

dqk.push({id:dq[i][0],
name:dq[i][1],
pid:dq[i][2]||-1});
//xx=xx||y如果xx为空,则赋值为y
}


结果例1

0 Object
id:1
name:"中国"
pid:-1


3.再将dpk的数据数形化

- 新建一个对象tree

- 先把dqk的数据一个一个的给tree(按id),在这个过程中,要去判断在原来的tree中是否存在它的上一级即dqk.pid in tree.id,若存在就把dqke给上一级(tree),当它的“孩子”,否则直接children为[]

var tree={}
for(var i in dqk){
var obj=dqk[i] ;
tree[obj.id]=obj;
if(tree[obj.pid]){
tree[obj.pid]["childens"]=tree[obj.pid]["childens"]||[],
tree[obj.pid]["childens"].push(obj)
}
}


部分结果例:

Object
childens:
Array[3]
0:Object
childens:Array[2]
id:2
name:"湖北"
pid:1
__proto__:
Object1:
Object
childens:Array[2]
id:3
name:"广东"
pid:1
__proto__:
Object2:
Object
childens:
Array[2]
id:4
name:"广西"
pid:1
__proto__:
Object
length:3
__proto__:
Array[0]
id:1
name:
"中国"
pid:-1
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: