javascript将list转换成树状结构的实例


Posted in Javascript onSeptember 08, 2017

如下所示:

/**
   * 将list装换成tree
   * @param {Object} myId 数据主键id
   * @param {Object} pId  数据关联的父级id
   * @param {Object} list list集合
   */
  function listToTree(myId,pId,list){
   function exists(list, parentId){
    for(var i=0; i<list.length; i++){
     if (list[i][myId] == parentId) return true;
    }
    return false;
   }
   
   var nodes = [];
   // get the top level nodes
   for(var i=0; i<list.length; i++){
    var row = list[i];
    if (!exists(list, row[pId])){
     nodes.push(row);
    }
   }
   
   var toDo = [];
   for(var i=0; i<nodes.length; i++){
    toDo.push(nodes[i]);
   }
   while(toDo.length){
    var node = toDo.shift(); // the parent node
    // get the children nodes
    for(var i=0; i<list.length; i++){
     var row = list[i];
     if (row[pId] == node[myId]){
      //var child = {id:row.id,text:row.name};
      if (node.children){
       node.children.push(row);
      } else {
       node.children = [row];
      }
      toDo.push(row);
     }
    }
   }
   return nodes;
  }
  
  var list=[
   {"ids":1,"parendId":0,"name":"Foods",url:"wwww"},
   {"ids":2,"parentId":1,"name":"Fruits"},
   {"ids":3,"parentId":1,"name":"Vegetables"},
   {"ids":4,"parentId":2,"name":"apple"},
   {"ids":5,"parentId":2,"name":"orange"},
   {"ids":6,"parentId":3,"name":"tomato"},
   {"ids":7,"parentId":3,"name":"carrot"},
   {"ids":8,"parentId":3,"name":"cabbage"},
   {"ids":9,"parentId":3,"name":"potato"},
   {"ids":10,"parentId":3,"name":"lettuce"},
   
   {"ids":11,"parendId":0,"name":"Foods"},
   {"ids":12,"parentId":11,"name":"Fruits"},
   {"ids":13,"parentId":11,"name":"Vegetables"},
   {"ids":14,"parentId":12,"name":"apple"},
   {"ids":15,"parentId":12,"name":"orange"},
   {"ids":16,"parentId":13,"name":"tomato"},
   {"ids":17,"parentId":13,"name":"carrot"},
   {"ids":18,"parentId":13,"name":"cabbage"},
   {"ids":19,"parentId":13,"name":"potato"},
   {"ids":20,"parentId":13,"name":"lettuce"}
  ];
  
  console.log(JSON.stringify(listToTree("ids","parentId",list)));
  console.log(listToTree("ids","parentId",list));

以上这篇javascript将list转换成树状结构的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript中的作用域链和闭包
Jun 30 Javascript
JavaScript加强之自定义event事件
Sep 21 Javascript
手写的一个兼容各种浏览器的javascript getStyle函数(获取元素的样式)
Jun 06 Javascript
JavaScript删除指定子元素代码实例
Jan 13 Javascript
jQuery+HTML5实现手机摇一摇换衣特效
Jun 05 Javascript
JS获取和修改元素样式的实例代码
Aug 06 Javascript
vue.js删除动态绑定的radio的指定项
Jun 02 Javascript
关于JavaScript中forEach和each用法浅析
Jul 27 Javascript
JS轮播图实现简单代码
Feb 19 Javascript
vue中动态添加class类名的方法
Sep 05 Javascript
使用layui的router来进行传参的实现方法
Sep 06 Javascript
js+css实现全屏侧边栏
Jun 16 Javascript
浅谈Angular4实现热加载开发旅程
Sep 08 #Javascript
js匿名函数使用&amp;传参(实例)
Sep 08 #Javascript
js HTML5 canvas绘制图片的方法
Sep 08 #Javascript
WebStorm ES6 语法支持设置&amp;babel使用及自动编译(详解)
Sep 08 #Javascript
React如何将组件渲染到指定DOM节点详解
Sep 08 #Javascript
javascript获取指定区间范围随机数的方法
Sep 08 #Javascript
原生js实现简单的模态框示例
Sep 08 #Javascript
You might like
PHP+Ajax异步通讯实现用户名邮箱验证是否已注册( 2种方法实现)
2011/12/28 PHP
简单实用的.net DataTable导出Execl
2013/10/28 PHP
PHP中加速、缓存扩展的区别和作用详解(eAccelerator、memcached、xcache、APC )
2016/07/09 PHP
微信支付的开发流程详解
2016/09/13 PHP
仿163填写邮件地址自动显示下拉(无优化)
2008/11/05 Javascript
js 弹出菜单/窗口效果
2011/10/30 Javascript
一个关于jqGrid使用的小例子(行按钮)
2011/11/04 Javascript
Jquery实现点击按钮,连续地向textarea中添加值的实例代码
2014/03/08 Javascript
jQuery实现仿腾讯微博滑出效果报告每日天气的方法
2015/05/11 Javascript
全面解析Bootstrap排版使用方法(标题)
2015/11/30 Javascript
Bootstrap中表单控件状态(验证状态)
2016/08/04 Javascript
使用JavaScript进行表单校验功能
2017/08/01 Javascript
shiro授权的实现原理
2017/09/21 Javascript
详解vue+vuex+koa2开发环境搭建及示例开发
2018/01/22 Javascript
vue监听对象及对象属性问题
2018/08/20 Javascript
jquery 动态遍历select 赋值的实例
2018/09/12 jQuery
JavaScript代码调试方法实例小结
2019/01/05 Javascript
浅谈如何优雅处理JavaScript异步错误
2019/11/12 Javascript
Vue 根据条件判断van-tab的显示方式
2020/08/03 Javascript
python+opencv实现动态物体识别
2018/01/09 Python
Python实现可自定义大小的截屏功能
2018/01/20 Python
PyCharm设置每行最大长度限制的方法
2019/01/16 Python
使用IDLE的Python shell窗口实例详解
2019/11/19 Python
解决pytorch-yolov3 train 报错的问题
2020/02/18 Python
解决python3插入mysql时内容带有引号的问题
2020/03/02 Python
Python 如何定义匿名或内联函数
2020/08/01 Python
电话销售经理岗位职责
2013/12/07 职场文书
爱我中华演讲稿
2014/05/20 职场文书
学习型班组申报材料
2014/05/31 职场文书
民政局副局长民主生活会个人整改措施
2014/10/04 职场文书
群众路线教育实践活动调研报告
2014/11/03 职场文书
外贸采购员岗位职责
2015/04/03 职场文书
2015年社区纪检工作总结
2015/04/21 职场文书
详解Redis复制原理
2021/06/04 Redis
零基础学java之带参数以及返回值的方法
2022/04/10 Java/Android
提高系统的吞吐量解决数据库重复写入问题
2022/04/23 MySQL