java递归实现json树结构,附带js实现树结构:子父节点

前言

         一个过程或函数在其定义或说明中有直接或间接调用自身的一种方法，它通常把一个大型复杂的问题层层转化为一个与原问题相似的规模较小的问题来求解，递归策略只需少量的程序就可描述出解题过程所需要的多次重复计算，大大地减少了程序的代码量。递归的能力在于用有限的语句来定义对象的无限集合。一般来说，递归需要有边界条件、递归前进段和递归返回段。当边界条件不满足时，递归前进；当边界条件满足时，递归返回。

递归的缺点：

         递归算法解题相对常用的算法如普通循环等，运行效率较低。因此，应该尽量避免使用递归，除非没有更好的算法或者某种特定情况，递归更为适合的时候。在递归调用的过程当中系统为每一层的返回点、局部量等开辟了栈来存储。递归次数过多容易造成栈溢出等。①百度词条--递归

1.实现效果



2.实现分析

当我们不清楚一个节点有多少个孩子的时候,得循环做查询,这里用到递归实现.用递归的时候要特别注意,递归是一定要有出口的,避免死循环.

一个简单的例子,实现n的阶乘:

public long factorial(long n){//求n!
if(n==0)return 1;
else return n*factorial(n-1);//利用递归n!=n*(n-1)!直到0
}

我们可以清楚的看到,1.有判断条件if(n==0)来作为出口,2.方法本身调用本身.

3.java联合查询数据库的代码实现

首先,数据库查询出的结果是这样的:



emon_no是设备本身,parent_no代表他的父亲,如果parent_no没有父亲,则是-1,代表第一层节点.

我们要实现的效果是:



我们先查询第一层,就是没有父节点的设备,获取他们的编号:



然后就可以在java里递归查询子节点,封装成map格式.

孩子的查询是通过父亲的编号获得:



//传入第一级节点开始查询,直到这级节点下的孩子没有孩子.

public List getInfoEmonChild(List<EempInfoEmon> eempInfoEmonList){
List<Map> listMap = new ArrayList();
EempInfoEmonMapper eempInfoEmonMapper = ctx.getBean(EempInfoEmonMapper.class);
for(EempInfoEmon eempInfoEmon :eempInfoEmonList){
List<EempInfoEmon> InfoEmonList =eempInfoEmonMapper.resultQuality1(eempInfoEmon.getEmonNo());//把父类的编号传入,查询改父亲下的子类
Map tempMap = new HashMap();
tempMap.put("id", eempInfoEmon.getEmonNo());
tempMap.put("name", eempInfoEmon.getEmonName());
if(InfoEmonList.size()>0){//如果该设备还有孩子,继续做查询,直到设备没有孩子,也就是最后一个节点
tempMap.put("children", getInfoEmonChild(InfoEmonList));
}
listMap.add(tempMap);
}
return listMap;
}

最后用Gson的toJson(listMap)转成josn,返回给前台

前台也做递归处理,js代码如下:

//data为后台传回json数据

var tableStr;

function reOrgData(data){

var orgdata = {
name: data.name,
id:data.id
};
if(data.children && data.children.length>0){

//这里使用的就是$.extend()的嵌套多个对象的功能。 所谓嵌套多个对象，有点类似于数组的合并的操作。

$.extend(orgdata,{children:[]});
for(var i=0; i<data.children.length; i++){
var subdata = reOrgData(data.children[i]);

<span style="color:#33CC00;">拼下拉选select的option,tableStr是全局变量,成功回调里用到

tableStr = tableStr + "<tr>"
+ "<td>"+ data.children[i].id + "</td>"
+ "<td>"+ data.id + "</td>"
+ "<td style='width:5em;'></td>"
+ "<td>"+ data.children[i].name + "</td>"
+ "<td style='width:10em;'><label class='f-orange'>正常</label><div class='uinn1 ui-btn-icon-right ui-icon-carat-r uw-app1 next'></div></td></tr>";

//把得到的subdata对象放入orgdata对象里

orgdata.children.push(subdata);
}
}
}

//成功回调函数里是这样的:

success: function(data){
var dataArr=data.data;
tableStr="";
if(dataArr.length>0){
$("#hint").hide();
for(var i=0;i<dataArr.length;i++){
var domMain  = document.getElementById('main'+i);
var datas = [];
tableStr=tableStr+"<tr><td>"+dataArr[i].id+"</td><td></td>+ <td style='width:5em;'></td> <td>"+dataArr[i].name+"</td><td style='width:10em;'><label class='f-orange'>正常</label><div class='uinn1 ui-btn-icon-right ui-icon-carat-r uw-app1 next'></div></td></tr>"
datas.push(reOrgData(dataArr[i]));
}
}else{
$("#hint").show();
}
//把前面拼好的tableStr写到页面上

$("#tb").html(tableStr);
createTable();
}

最后,就达到了最开始图片的效果: