我们常常在做后台管理系统的时候 需要对数据进行组装成一个树装结构,这里特地将此方法进行封装:

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基石之-----数组转换为树结构函数的更多相关文章

  1. js将伪数组转换为标准数组的多种方法

    在js中,数组是特殊的对象,凡是对象有的性质,数组都有,数组表示有序数据的集合,而对象表示无序数据的集合. 那伪数组是什么呢,当然它也是对象,伪数组一般具有以下特点: 按索引方式存储数据: 具有len ...

  2. js中将类数组转换为数组的几种方法

    1.slice方法 最经典的方法,使用Array的slice方法,此方法如果不传参数的话会返回原数组的一个拷贝,因此可以用此方法转换类数组到数组: // 创建一个类数组对象 var alo = {0: ...

  3. 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++ ...

  4. JavaScript的作用;JS常见的三种对话框;==和===的区别;函数内部参数数组arguments在函数内部打印实参;JS的误区:没有块级作用域

    JS:客户端(浏览器)脚本语言 弱类型 基于原型 事件驱动 不需要编译(直接运行)   JS的作用:表单验证,减轻服务端的压力 添加页面动画效果  动态更改页面内容  Ajax网络请求 (一)常见的对 ...

  5. JS: 数组的循环函数

    JS 数组相关的循环函数,用得挺多,所以有些坑还是要去踩一下,先来看一道面试题. 注意:下面提到的不改变原数组仅针对基本数据类型. 面试题 模拟实现数组的 map 函数. 心中有答案了吗?我的答案放在 ...

  6. JQuery/JS插件 数组转换为Table

    //数组 转换为 table var arr = [{ "D_AlarmValue": 7.00, "D_Code": "002", &qu ...

  7. js数组的splice函数

    一直没搞懂数组的splice函数,今天稍微测试了一下,了解了它的功能,在这里记录一下 1.测试 测试① var a = [1,2,3]; console.info(a.splice(1,1)); co ...

  8. js一维数组转换为二维数组

    function arrTrans(num, arr) { // 一维数组转换为二维数组 const iconsArr = []; // 声明数组 arr.forEach((item, index) ...

  9. JS Jquery去除数组重复元素

    js jquery去除数组中的重复元素 第一种:$.unique() 第二种: for(var i = 0,len = totalArray_line.length;i < len;i++) { ...

随机推荐

  1. jQYERY

    1.事件流: (1)事件捕获 (2)处于目标阶段 (3)事件冒泡 2.事件对象 对每一个事件都会回调函数,会有一个默认的事件对象,就是this event.target 触发的目标对象 event.t ...

  2. 201871010128-杨丽霞《面向对象程序设计(java)》第七周学习总

    201871010128-杨丽霞-<面向对象程序设计(java)>第七周学习总结 项目 内容 这个作业属于哪个课程  https://www.cnblogs.com/nwnu-daizh/ ...

  3. CF1193A Amusement Park

    洛谷 CF1193A Amusement Park 洛谷传送门 题目翻译 有一个游乐场有一个好玩的项目:一些有向滑梯可以将游客从一个景点快速.刺激地传送到另一个景点.现在,你要帮游乐场老板来规划一个造 ...

  4. Fedora增加rc-local服务开机自启项

      最近新装了一台Fedora 30系统,服务已经正常运行起来了,但是偶然发现当我的系统重启后,写在rc.local配置文件里的命令居然没生效,导致我系统重启,但是服务却没有正常运行,后来经过一番查阅 ...

  5. Java基础的容错

    新手会有一些常犯的过失,一般一个新手在学习Java开发的时分,往往会挑选买书去学习,首要这样的学习功率是非常差的,比如在学习html,css的时分,是彻底不必看书的.书里大多数东西你都不了解.这是新手 ...

  6. 8.Vue的slot

    1.什么是slot 在  Vue.js  中我们使用  <slot>  元素作为承载分发内容的出口,作者称其为 插槽,可以应用在组合组件的场景中 2.使用 建立组件预留插槽 定义填充入插槽 ...

  7. itsdangerous模块

    使用场景: 在取消订阅时,可以在URL里序列化并且签名一个用户的ID或在任何的激活账户的链接或类似的情形下使用.这种情况下不需要生成一个一次性的token并把它们存到数据库中. 被签名的对象可以被存入 ...

  8. ASP.NET Core 进程内(InProcess)托管

    ASP.NET Core 进程内(InProcess)托管 在 ASP.NET Core 中的进程内(InProcess)托管模型 什么是 Kestrel 服务器 当一个 ASP.NET Core 应 ...

  9. 【转】使用Hibernate的好处是什么?

    一.Hibernate是JDBC的轻量级的对象封装,它是一个独立的对象持久层框架,和App Server,和EJB没有什么必然的联系.Hibernate可以用在任何JDBC可以使用的场合,例如Java ...

  10. windwos文件句柄数限制

    1.修改注册表,位置如下: HKEY_LOCAL_MACHINE/SOFTWARE/Microsoft/Windows NT/CurrentVersion/Windows 2.设置 1.GDIProc ...