pId的数据结构转children 数据结构(JS);
在工作中经常遇到需要把带有pId的的list数据转换为children格式的树形结构,一直都
没有找到太好的工具函数。偶然间看到了这个函数,研究了下,感觉这个函数很强大,所以
记录下来,作为备用,同时也贴出来,供大家使用; /**
* json格式转树状结构
* @param {json} json数据
* @param {String} id的字符串
* @param {String} 父id的字符串
* @param {String} children的字符串
* @return {Array} 数组
*/
function transData(a, idStr, pidStr, chindrenStr){
var r = [], hash = {}, id = idStr, pid = pidStr, children = chindrenStr, i = 0, j = 0, len = a.length;
for(; i < len; i++){
hash[a[i][id]] = a[i];
}
for(; j < len; j++){
var aVal = a[j], hashVP = hash[aVal[pid]];
if(hashVP){
!hashVP[children] && (hashVP[children] = []);
hashVP[children].push(aVal);
}else{
r.push(aVal);
}
}
return r;
} var jsonData = eval('[{"id":"4","pid":"1","name":"大家电"},{"id":"5","pid":"1","name":"生活电器"},{"id":"1","pid":"0","name":"家用电器"},{"id":"2","pid":"0","name":"服饰"},{"id":"3","pid":"0","name":"化妆"},{"id":"7","pid":"4","name":"空调"},{"id":"8","pid":"4","name":"冰箱"},{"id":"9","pid":"4","name":"洗衣机"},{"id":"10","pid":"4","name":"热水器"},{"id":"11","pid":"3","name":"面部护理"},{"id":"12","pid":"3","name":"口腔护理"},{"id":"13","pid":"2","name":"男装"},{"id":"14","pid":"2","name":"女装"},{"id":"15","pid":"7","name":"海尔空调"},{"id":"16","pid":"7","name":"美的空调"},{"id":"19","pid":"5","name":"加湿器"},{"id":"20","pid":"5","name":"电熨斗"}]'); var jsonDataTree = transData(jsonData, 'id', 'pid', 'chindren');
console.log(jsonDataTree);
//[{"id":"1","pid":"0","name":"家用电器","chindren":[{"id":"4","pid":"1","name":"大家电","chindren":[{"id":"7","pid":"4","name":"空调","chindren":[{"id":"15","pid":"7","name":"海尔空调"},{"id":"16","pid":"7","name":"美的空调"}]},{"id":"8","pid":"4","name":"冰箱"},{"id":"9","pid":"4","name":"洗衣机"},{"id":"10","pid":"4","name":"热水器"}]},{"id":"5","pid":"1","name":"生活电器","chindren":[{"id":"19","pid":"5","name":"加湿器"},{"id":"20","pid":"5","name":"电熨斗"}]}]},{"id":"2","pid":"0","name":"服饰","chindren":[{"id":"13","pid":"2","name":"男装"},{"id":"14","pid":"2","name":"女装"}]},{"id":"3","pid":"0","name":"化妆","chindren":[{"id":"11","pid":"3","name":"面部护理"},{"id":"12","pid":"3","name":"口腔护理"}]}]
pId的数据结构转children 数据结构(JS);的更多相关文章
- 你真的懂redis的数据结构了吗?redis内部数据结构和外部数据结构揭秘
Redis有哪些数据结构? 字符串String.字典Hash.列表List.集合Set.有序集合SortedSet. 很多人面试时都遇到过这种场景吧? 其实除了上面的几种常见数据结构,还需要加上数据结 ...
- redis内部数据结构和外部数据结构揭秘
Redis有哪些数据结构? 字符串String.字典Hash.列表List.集合Set.有序集合SortedSet. 很多人面试时都遇到过这种场景吧? 其实除了上面的几种常见数据结构,还需要加上数据结 ...
- 数据结构1:数据结构与算法C语言版分析概述
本节开始将带领大家系统地学习数据结构,作为一门计算机专业大二学生的必修课程,该课程面对的目标人群为初步具备基本编程能力和编程思想的程序员(大一接触了 C 语言或者 C++).通过系统地学习数据结构,可 ...
- 你真的懂了redis的数据结构吗?redis内部数据结构和外部数据结构揭秘
原文链接:https://mp.weixin.qq.com/s/hKpAxPE-9HJgV6GEdV4WoA Redis有哪些数据结构? 字符串String.字典Hash.列表List.集合Set.有 ...
- ES6 之 Set数据结构和Map数据结构 Iterator和for...of循环
ECMAScript 6 入门 Set数据结构 基本用法 ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成Set数据结构. va ...
- (4)java数据结构--集合类及其数据结构归纳-有大图
Java集合类及其数据结构归纳 - s小小的我 - 博客园http://www.cnblogs.com/shidejia/p/6433788.html ---------大图可以 在新标签中打开图片 ...
- PHP数据结构之一:PHP数据结构基本概念—数据结构
学习任何一种技术都应该先清楚它的基本概念,这是学习任何知识的起点!本文是讲述数据结构的基本概念,适合对数据结构已经有一定基础的程序员,更是适合想要学习数据结构的code一族!让我们开始PHP数据结构的 ...
- Python数据结构1-----基本数据结构和collections系列
1.基本数据结构 整型.浮点型.字符串.元祖.列表.字典.集合 2.高级数据结构 (collections模块) (1)计数器(counter):对字典的补充,用于追踪值的出现次数. [具备字典所有的 ...
- python算法与数据结构-什么是数据结构
一.什么是数据结构 数据结构,直白地理解,就是研究数据的存储方式. 我们知道,数据存储只有一个目的,即为了方便后期对数据的再利用,就如同我们使用数组存储 {1,2,3,4,5} 是为了后期取得它们的值 ...
随机推荐
- 查看 tensorflow 是GPU版本 还是CPU版本
在Python环境中输入: import os from tensorflow.python.client import device_lib os.environ["TF_CPP_MIN_ ...
- Flask Web开发实战(入门、进阶与原理解析)
URL重定向 错误响应 > 如果你想手动返回错误响应,可以使用Flask提供的abort()函数. XML 上下文全局变量 [](https://img2018.cnblogs.com/blog ...
- RabbitMQ 在Linux环境中的默认位置
参考:https://www.rabbitmq.com/relocate.html
- 03-树2 List Leaves (25 分)
Given a tree, you are supposed to list all the leaves in the order of top down, and left to right. I ...
- PHP sprintf() 函数
PHP sprintf() 函数 先说下为什么要写这个函数的前言,这个是我在微信二次开发的一个token验证文档也就是示例文档看到的一个函数,当时非常不理解,于是查了百度,但是很多结果都很笼统,结果也 ...
- poj3190
一.题意:有n头牛,每头牛需要占用一个时间段的时间来挤奶,且必须有机器.问最少需要多少个机器 二.思路:区间贪心.把尽量多的牛放在一个棚子里,这样就可以使得用到的棚子数最少.只要任意两头牛的挤奶时间不 ...
- maven-eclipse-plugin downloadSources downloadJavadocs
<plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-eclip ...
- BENZ Prognosis System C5 SD Be connected & Panasonic Xentry-Tab
Brand-new released!! Recently, we all autonumen website gives a brand-new Superstar prognosis bundle ...
- vue 的计算属性computed自我理解
类型:{ [key: string]: Function | { get: Function, set: Function } } 计算属性的结果会被缓存,除非依赖的响应式属性变化才会重新计算.注意, ...
- java多线程-Lock
大纲: Lock接口 synchronized&Lock异同 一.Lock public interface Lock { void lock(); void lockInterruptibl ...