递归系列——树型JSON数据转换问题
JSON数据转换方式:
1.标准结构=>简单结构
var root = {
id: 'root',
children: [
{
id: "1",
children: [
{ id: "1-1", children: [] },
{ id: "1-2", children: [] }
]
},
{
id: "2",
children: [
{ id: "2-1", children: [] },
{ id: "2-2", children: [] }
]
}
]
};
function transform(data, array, parent){
var node = {};
node.id = data.id;
node.pid = parent;
array.push(node);
data.children.forEach(function(value){
transform(value,array,data.id);
})
return array;
}
console.log(transform(root,[],null));
输出如下:
2.简单结构=>标准结构
var data = [
{ id: "root", pid: null },
{ id: "", pid: "root" },
{ id: "1-1", pid: "" },
{ id: "1-2", pid: "" },
{ id: "", pid: "root" },
{ id: "2-1", pid: "" },
{ id: "2-2", pid: "" }
];
function transform(data, object){ //始终保证object有children属性
!object.children && (object.children = []);
data.forEach(function(value){
console.log(object);
if(value.pid == object.id){
//根节点处理
if (!value.pid) {
object.id = value.id; }else {
var node = {};
node.id = value.id;
object.children.push(node);
transform(data, node);
}
}
})
return object;
}
console.log(transform(data,{}));
输出如下:
{
children: [
{
id: ""
children: [
{
id: "1-1"
children: []
},
{
id: "1-2"
children: []
}]
},
{
id: ""
children: [
{
id: "2-1"
children: []
},
{
id: "2-2"
children: []
}]
}]
id: "root"
}
上述递归中都有数据的传递,这是一种accumulator技术。比如第一个函数中的array和第二个函数中data,递归过程中始终是同一个数据。
递归系列——树型JSON数据转换问题的更多相关文章
- vuejs学习--递归组件(树型表格分享)
前言 学习vue有一段时间了,最近使用vue做了一套后台管理系统,其中使用最多就是递归组件,也因为自己对官方文档的不熟悉使得自己踩了不少坑,今天写出来和大家一起分享. 递归组件 组件在它的模板内可以递 ...
- SQL递归获取树型路径中文名称
项目中遇到一个树型结构表要根据任意传入节点获取它从根节点一直到自身节点的全部路径的中文名称,并且用'>'与分隔. 我使用在sqlServer中写了一个解析函数方便开发调用. USE [RP_ER ...
- JavaScript:使用递归构建树型菜单
使用递归函数将扁平数据转为树型结构,并渲染到页面 效果图: 代码: <!DOCTYPE html> <html lang="en"> <head> ...
- 菜鸟笔记:node.js+mysql中将JSON数据构建为树(递归制作树状菜单数据接口)
初学Web端开发,今天是第一次将所学做随笔记录,肯定存在多处欠妥,望大家海涵:若有不足,望大家批评指正. 进实验室后分配到的第一个项目,需要制作一个不确定层级树形菜单的数据接口,对于从来没实战编过程的 ...
- 路径字符串数据转化为树型层级对象,path to json tree
由于项目中使用了react 及 ant-design ,在使用tree树型控件时,需要 类似下面的数据, const treeData = [{ title: '0-0', key: '0-0', c ...
- Rafy 领域实体框架 - 树型实体功能(自关联表)
在 Rafy 领域实体框架中,对自关联的实体结构做了特殊的处理,下面对这一功能进行讲解. 场景 在开发数据库应用程序时,往往会遇到自关联表的场景.例如,分类信息.组织架构中的部门.文件夹信息等,都 ...
- Mac:文件夹树型展示 tree
目标: 想要在MAC的Terminal中查看文件夹中所有文件的树型结构及文件夹.文件树统计. 安装方法: 1.brew安装 官网:http://brew.sh/ brew是Mac中安装软件的神器,一定 ...
- RDIFramework.NET V2.7 Web版本升手风琴+树型目录(2级+)方法
RDIFramework.NET V2.7 Web版本升手风琴+树型目录(2级+)方法 手风琴风格在Web应用非常的普遍,越来越多的Web应用都是采用这种方式来体现各个功能模块,传统的手风琴风格只支持 ...
- 树型动态规划(树形dp)
树型动态规划就是在“树”的数据结构上的动态规划,树型动态规划是建立在树上的,所以有二个方向: 1.根—>叶:这种题目基本上碰不到 2.叶->根:根的子节点传递有用的信息给根,完后根得出最优 ...
随机推荐
- 廖雪峰Java11多线程编程-2线程同步-1同步代码块
1.线程安全问题 多个线程同时运行,线程调度由操作系统决定,程序本身无法决定 如果多个线程同时读写共享变量,就可能出现问题 class AddThread extends Thread{ public ...
- php 怎样判断一段字符 有没有经过 urlencode 处理
有没有百分号 判断字符串 执行urldecode 之前和之后是否一致 一致就是没有经过urlencode 不一致就是经过urlencode的 自己方法:判断是否所有: if(strpos($cooki ...
- PAT甲级——A1013 Battle Over Cities
It is vitally important to have all the cities connected by highways in a war. If a city is occupied ...
- mysql数据库引擎(转载)
数据库引擎介绍 MySQL数据库引擎取决于MySQL在安装的时候是如何被编译的.要添加一个新的引擎,就必须重新编译MYSQL.在缺省情况下,MYSQL支持三个引擎:ISAM.MYISAM和HEAP.另 ...
- java基础之集合(Set,Map,List)总结
一.Collection接口 1.Collection接口两个子接口 -List接口 -ArrayList: -Vector: -LinkedL ...
- hbase设计方案1
好的方案应该挺多的,比如:可以将[日.周.月]以3,2,1来表示(拼接到ROW_KEY中){离线跑job时候,可以分为月job(每月末run一下,周job(每周末run一下),日job(每天run一下 ...
- hdu1863畅通工程
畅通工程 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submi ...
- Java review-basic6
1. Weak references: In computer programming, a weak reference is a reference that does not protect t ...
- DEV GridControl 控件属性大全
Devpress.XtraGrid.GridControl.GridView 属性 说明 Options OptionsBehavior 视图的行为选项 AllowIncrementalSearch ...
- GIT → 05:Git命令行操作
5.1 打开命令行窗口 安装Git后,在资源管理器的空白处,单击鼠标右键打开窗口,点击 Git Bash Here ,打开Git命令行窗口,在窗口中可直接使用Linux命令操作: 5.2 初始化Git ...