美文网首页
js 数组转树方法

js 数组转树方法

作者: 傑仔 | 来源:发表于2019-04-26 10:36 被阅读0次
##方法1
function array2Tree(array) {
    const result = []
      if (!Array.isArray(array)) {
        return result
      }
      array.forEach(item => {
        delete item.children
      })
      const map = {}
      array.forEach(item => {
        map[item.id] = item
      })
      array.forEach(item => {
        const parent = map[item.parentId]
        if (parent) {
          (parent.children || (parent.children = [])).push(item)
        } else {
          result.push(item)
        }
      })
      return result
    }
##方法2
/**
*通过递归实现
* data 数组数据
* pid 顶级元素的parentId值
*/
function array2Tree (data, pid) {
  let result = []
  let temp
  for (let i = 0; i < data.length; i++) {
    if (data[i].parentId === pid) {
      let obj = {id: data[i].id, name: data[i].name}
      temp = array2Tree(data, data[i].id)
      if (temp.length > 0) {
        obj.children = temp
      }
      result.push(obj)
    }
  }
  return result
}

const array = [
    {id:1, parentId: null, name: 'a'},
    {id:2, parentId: null, name: 'b'},
    {id:3, parentId: 1, name: 'c'},
    {id:4, parentId: 2, name: 'd'},
    {id:5, parentId: 1, name: 'e'},
    {id:6, parentId: 3, name: 'f'},
]
arrayToTree(array)

相关文章

  • js 数组转树方法

  • js实现数组转树

    1. 原生 封装工具函数 getTree 1.1 定义 -映射对象 map 数组treeList=[] 1.2 遍...

  • js数组遍历方法总结

    转自: js数组遍历方法总结 数组遍历方法 1.for循环 使用临时变量,将长度缓存起来,避免重复获取数组长度,当...

  • 【转】JS数组方法

    原文链接:JS数组方法总览及遍历方法耗时统计 01、push(value)将value添加到数组的最后,返回数组长...

  • [转]JS数组遍历方法

    文章主要来源: JS数组遍历方法总结 -- 我是豆子啊 我们用更简洁的语法(比如内置函数)遍历数组,从而消除循环结...

  • js中的几点常用知识

    1.js中的字符串反转输出 js中的字符串反转输出的N种方法: 2.js中数组转字符串和字符串转数组 javasc...

  • js数组的迭代方法(转)

    转自知乎用户@水乙

  • 数组(Array)<迭代器>

    一、Js数组迭代器方法 主要介绍js数组中的forEach,every,some,filter,map迭代器方法 ...

  • 数组检测

    检测是否是数组: 数组转字符串: 字符串转换数组: js对象转换成js字符串: js字符串转换成js对象:

  • js基础了解

    js数组常用遍历方法使用: js数组常用操作方法使用: 基本逻辑运算: 基本字符串操作方法:

网友评论

      本文标题:js 数组转树方法

      本文链接:https://www.haomeiwen.com/subject/rsffnqtx.html