树状结构的数据的处理方法

Posted dongdong1996

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了树状结构的数据的处理方法相关的知识,希望对你有一定的参考价值。

后端给我们返回的树状结构数据,我们一般用递归来处理。

什么是递归?

来自度娘的解释

程序调用自身的编程技巧称为递归( recursion)。递归做为一种算法程序设计语言中广泛应用。 一个过程或函数在其定义或说明中有直接或间接调用自身的一种方法,它通常把一个大型复杂的问题层层转化为一个与原问题相似的规模较小的问题来求解,递归策略只需少量的程序就可描述出解题过程所需要的多次重复计算,大大地减少了程序的代码量。递归的能力在于用有限的语句来定义对象的无限集合。一般来说,递归需要有边界条件、递归前进段和递归返回段。当边界条件不满足时,递归前进;当边界条件满足时,递归返回。

简言之就是自己上了自己。

贴个别人的代码哈哈哈哈

var data = [
 {
     name: "所有物品",
     children: [
         {
             name: "水果",
             children: [{name: "苹果", children: [{name: ‘青苹果‘}, {name: ‘红苹果‘}]}]
         },
         {
             name: ‘主食‘,
             children: [
                 {name: "米饭", children: [{name: ‘北方米饭‘}, {name: ‘南方米饭‘}]}
             ]
         },
         {
             name: ‘生活用品‘,
             children: [
                 {name: "电脑类", children: [{name: ‘联想电脑‘}, {name: ‘苹果电脑‘}]},
                 {name: "工具类", children: [{name: "锄头"}, {name: "锤子"}]},
                 {name: "生活用品", children: [{name: "洗发水"}, {name: "沐浴露"}]}
             ]
         }
  ]
}]

这个是后端返给我们的数据

下面的代码是处理的方法

//递归遍历实现
var recursiveFunction = function(){
    var str = ‘‘
    const getStr = function(list){
        list.forEach(function(row){
            if(row.children){
                getStr(row.children)
            }else {
                str += row.name + ";"
            }
        })
    }
    getStr(data)
    console.log(str)
}
recursiveFunction()
//输出:青苹果;红苹果;北方米饭;南方米饭;联想电脑;苹果电脑;锄头;锤子;洗发水;沐浴露;

递归可以轻松实现多级的遍历

其实除了这个递归的方法,我查了一下别人的博客,发现还可以用JSONPath实现对树状数据的处理

npm install JSONPath 你首先要安装一下

emmmmmm

其实我也不会,也没用过。具体的使用方法,用的时候再去查吧。

 

以上是关于树状结构的数据的处理方法的主要内容,如果未能解决你的问题,请参考以下文章

一文带你吃透js处理树状结构数据的增删改查

用树状数组处理逆序对[数据结构][树状数组]

分享使用NPOI导出Excel树状结构的数据,如部门用户菜单权限

优雅的处理树状结构——组合模式总结

ES6 Promise 的不完全实现

树状数组的基操