var data = [
{id:100000, name :"1", pid :0},
{id:100100, name :"1-1", pid :100000, },
{id:100101, name :"1-1-1", pid :100100, },
{id:200000, name :"2", pid :0, },
{id:210000, name :"2-1", pid :200000, },
{id:211000, name :"2-1-1", pid :210000, },
{id:211100, name :"2-1-1-1", pid :211000, },
{id:211110, name :"2-1-1-1-1", pid :211100, },
{id:211111, name :"2-1-1-1-1-1", pid :211110, }
]
function toTree(data) { // 删除 所有 children,以防止多次调用
data.forEach(function (item) {
delete item.children;
});
console.log(data)
// 将数据存储为 以 id 为 KEY 的 map 索引数据列
var map = {};
data.forEach(function (item) {
map[item.id] = item;
});
console.log(map);
var val = [];
data.forEach(function (item) {
// 以当前遍历项,的pid,去map对象中找到索引的id
var parent = map[item.pid];
console.log(parent);
debugger
// 好绕啊,如果找到索引,那么说明此项不在顶级当中,那么需要把此项添加到,他对应的父级中
if (parent) {
(parent.children || ( parent.children = [] )).push(item);
console.log(data,val); } else {
//如果没有在map中找到对应的索引ID,那么直接把 当前的item添加到 val结果集中,作为顶级
val.push(item);
}
}); return val;
} console.log(toTree(data))

  

javascript当中的无限分类的更多相关文章

  1. JS当中的无限分类递归树

    列表转换成树形结构方法定义: //javascript 树形结构 function toTree(data) { // 删除 所有 children,以防止多次调用 data.forEach(func ...

  2. javascript 无限分类

    * 根据php无限分类实现js版本的 /** * 根节点 parentid=0, 每个节点都有id, parentid字段 * @param items * @returns {*} */ funct ...

  3. 后台树状菜单,js实现递归无限分类

    //新闻类别管理 public function new_classify() { $arr = M('news_classify')->where("fid = 0")-& ...

  4. php无限分类方法类

    创建数据库以及表 CREATE DATABASE `sortclass`DEFAULT CHARSET utf8; CREATE TABLE IF NOT EXISTS `class` ( `cid` ...

  5. MySql无限分类数据结构--预排序遍历树算法

    MySql无限分类数据结构--预排序遍历树算法 无限分类是我们开发中非常常见的应用,像论坛的的版块,CMS的类别,应用的地方特别多. 我们最常见最简单的方法就是在MySql里ID ,parentID, ...

  6. TreeView递归绑定无限分类数据

    TreeView递归绑定无限分类数据 实现一个动态绑定,无限级分类数据时,需要将数据绑定到TreeView控件,分类表的结构是这样的: 字段 类型 Id int ParentId int Name N ...

  7. 关于无限分类的树状输出(id,name,pid)类型的

    首先创建无限分类的数据表,我这里采用的是id.name.pid这种类型(当然还有很多种无限分类的方式了,比如:id.name.pid.path.left.right左右节点的形式) CREATE TA ...

  8. php递归方法实现无限分类实例

    数组:  代码如下 复制代码 $items = array( array('id' => 1, 'pid' => 0, 'name' => '一级11' ), array('id' ...

  9. PHP+Mysql无限分类的方法汇总

    无限分类是个老话题了,来看看PHP结合Mysql如何实现.第一种方法这种方法是很常见.很传统的一种,先看表结构表:categoryid int 主键,自增name varchar 分类名称pid in ...

随机推荐

  1. 小白零基础C#学习笔记

    一.概述 1..Net 1)..Net平台 2)..Net Frameword框架 说明:是.Net平台中不可缺少的一部分,提供了一个稳定的运行环境来保证.Net平台开发的各种应用能够正常运转. 2. ...

  2. 缓存方案:本地guavaCache, 远程redis?

    线程内部缓存:a. 局部变量HashMap, 方法间传递  b. 使用ThreadLocal 本地缓存:单jvm内共享 可以使用(Concurrent)HashMap自己实现,也可以使用GuavaCa ...

  3. 利用vue-cli搭建vue项目

    手把手教你用vue-cli搭建vue项目 本篇主要是利用vue-cli来搭建vue项目,其中前提是node和npm已经安装好,文章结尾将会简单提到一个简单的例子.使用vue-cli搭建项目最开始我也是 ...

  4. 转 Django中的Form

    https://www.cnblogs.com/chenchao1990/p/5284237.html Form 一.使用Form Django中的Form使用时一般有两种功能: 1.生成html标签 ...

  5. 树莓派安装Raspbian系统以及相关配置(通过Windows)

    1.准备 树莓派3B+(E14) 一张内存卡 (至少16G) 一个读卡器 普通电脑显示器,键盘,鼠标 2.操作系统烧制(下面的操作都是在Windows中操作,通过读开启读取内存卡) Raspbian系 ...

  6. Java基础09-循环结构

    1.while循环(循环次数不确定的情况通常用这个) 特点:先判断,再执行 public class Test{ public static void main(String[] args){ int ...

  7. Murano Weekly Meeting 2016.08.09

    Meeting time: 2016.August.09 1:00~2:00 Chairperson:  Kirill Zaitsev, from Mirantis Meeting summary: ...

  8. WEB服务器、网站、域名、IP地址、DNS服务器之间的关系

    域名首先指向你的服务器,这个过程叫解析.  服务器分成好多小块,每小块叫一个空间或者一个虚拟主机.  所以当你输入你的域名以后,服务器收到你域名的访问信息,但不知道要打开这么多个小块中的那一个.所以要 ...

  9. maven课程 项目管理利器-maven 5-1 课程总结 1星(2018-11-08 07:19)

    1 maven windows环境搭建和配置环境变量 2 maven骨架和pom.xml 解析 3 命令行窗口常用的maven命令 4 仓库和坐标 5 maven Java项目 6 生命周期,依赖聚合 ...

  10. JS判断web网站访问端是PC电脑还是手机

    通过JS语句判断WEB网站的访问端是电脑还是手机,以显示不同的页面! <script type="text/javascript"> <!-- //平台.设备和操 ...