JS基石之-----数组转换为树结构函数
我们常常在做后台管理系统的时候 需要对数据进行组装成一个树装结构,这里特地将此方法进行封装:
let data = [
{ id: , text: 't11', parentId: },
{ id: , text: 't11', parentId: },
{ id: , text: 't11', parentId: },
{ id: , text: 't11', parentId: },
{ id: , text: 't11', parentId: },
{ id: , text: 't11', parentId: }
]
function treeData (data, id, parentId, childName) {
let cloneData = JSON.parse(JSON.stringify(data))
return cloneData.filter((father) => {
let newArr = cloneData.filter((child) => {
return father[id] === child[parentId]
})
father[childName] = newArr
return father[parentId] ===
})
}
let msg = treeData(data, 'id', 'parentId', 'childaaa')
console.log(msg)
JS基石之-----数组转换为树结构函数的更多相关文章
- js将伪数组转换为标准数组的多种方法
在js中,数组是特殊的对象,凡是对象有的性质,数组都有,数组表示有序数据的集合,而对象表示无序数据的集合. 那伪数组是什么呢,当然它也是对象,伪数组一般具有以下特点: 按索引方式存储数据: 具有len ...
- js中将类数组转换为数组的几种方法
1.slice方法 最经典的方法,使用Array的slice方法,此方法如果不传参数的话会返回原数组的一个拷贝,因此可以用此方法转换类数组到数组: // 创建一个类数组对象 var alo = {0: ...
- JS 封装一个对数组去重的函数
var zz = [1,2,3,5,5,7,8,6,6]; var se = []; d(se); function d(attr){ for(var i = 1;i<zz.length;i++ ...
- JavaScript的作用;JS常见的三种对话框;==和===的区别;函数内部参数数组arguments在函数内部打印实参;JS的误区:没有块级作用域
JS:客户端(浏览器)脚本语言 弱类型 基于原型 事件驱动 不需要编译(直接运行) JS的作用:表单验证,减轻服务端的压力 添加页面动画效果 动态更改页面内容 Ajax网络请求 (一)常见的对 ...
- JS: 数组的循环函数
JS 数组相关的循环函数,用得挺多,所以有些坑还是要去踩一下,先来看一道面试题. 注意:下面提到的不改变原数组仅针对基本数据类型. 面试题 模拟实现数组的 map 函数. 心中有答案了吗?我的答案放在 ...
- JQuery/JS插件 数组转换为Table
//数组 转换为 table var arr = [{ "D_AlarmValue": 7.00, "D_Code": "002", &qu ...
- js数组的splice函数
一直没搞懂数组的splice函数,今天稍微测试了一下,了解了它的功能,在这里记录一下 1.测试 测试① var a = [1,2,3]; console.info(a.splice(1,1)); co ...
- js一维数组转换为二维数组
function arrTrans(num, arr) { // 一维数组转换为二维数组 const iconsArr = []; // 声明数组 arr.forEach((item, index) ...
- JS Jquery去除数组重复元素
js jquery去除数组中的重复元素 第一种:$.unique() 第二种: for(var i = 0,len = totalArray_line.length;i < len;i++) { ...
随机推荐
- vue-particles粒子动画插件的使用和爬坑出现垂直滚动条
1下载==>cnpm install vue-particles --save-dev 2引入 注册-->main.js//插件 import VueParticles from 'vue ...
- flask POOL,websocket握手
一.POOL Pool就是为了多线程访问数据库,减少数据库压力 回顾pymysql import pymysql #建立连接 mysql_conn = pymysql.connect(host=&qu ...
- 201871010112-梁丽珍《面向对象程序设计(java)》第十四周学习总结
项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 https://www.cnblogs.com/nwnu-daizh/p ...
- 201871010136 -赵艳强《面向对象程序设计(java)》第十六周学习总结
201871010136-赵艳强<面向对象程序设计(java)>第十六周学习总结 项目 内容 这个作业属于哪个课程 <任课教师博客主页链接>https://www.cnbl ...
- 批处理简单命令 start
start 命令 调用外部程序,所有的DOS命令和命令行程序都可以由start命令来调用. 如:start calc.exe 即可打开Windows的计算器. 常用参数: MIN 开始时窗口最小化 S ...
- Linux学习笔记-第8天 - 看似很简单
这些东西已经看了三遍,已经能够理解了.看似很简单,希望真正在用的时候不会出差子.
- 洛谷 P5461 赦免战俘
洛谷 P5461 赦免战俘 传送门 思路 洛谷7月月赛第一题 着实是一道大水题,然后我月赛的时候没做出来...... 就是一道大模拟题呀,直接dfs就好了,我是反着处理的,所以最后要输出\(1-a[i ...
- 【可视化】Vue基础
作者 | Jeskson 来源 | 达达前端小酒馆 Vue简介 Vue框架,框架的作者,尤雨溪,组件化,快速开发的特点. 生命周期 beforeCreate:组件刚刚被创建 created:组件创建完 ...
- java大作业博客--购物车
Java 大作业----使用MySQL的购物车 一.团队介绍 姓名 任务 李天明.康友煌 GUI设计及代码编写 谢晓淞 业务代码编写.MySQL服务器平台部署.git代码库 严威 类和包的结构关系设计 ...
- Spring Boot 知识笔记(集成zookeeper)
一.本机搭建zookeeper伪集群 1.下载安装包,复制三份 2.每个安装包目录下面新建一个data文件夹,用于存放数据目录 3.安装包的conf目录下,修改zoo.cfg配置文件 # The nu ...