资讯专栏INFORMATION COLUMN

算法-无限分类递归

zhonghanwen / 1817人阅读

摘要:作为前端不用算法也可以写成项目但是如果明白会算法的话你写起代码来会更得心应手无限分类递归多数用在树形结构数据有这样一组数据张三的儿子张三的儿子李四的儿子张三的儿子的儿子张三李四王五想要得到的结果是这样子的张三张三的儿子张三的儿子的儿子张三的

作为前端, 不用算法也可以写成项目. 但是如果明白会算法的话, 你写起代码来会更得心应手.
无限分类递归 多数用在树形结构数据. 有这样一组数据:
const arr = [
    {
        id: 4,
        name: "张三的儿子",
        parentId: 1
    },
    {
        id: 43,
        name: "张三的2儿子",
        parentId: 1
    },
    {
        id: 5,
        name: "李四的儿子",
        parentId: 2
    },
    {
        id: 6,
        name: "张三的儿子的儿子",
        parentId: 4
    },
    {
        id: 1,
        name: "张三",
        parentId: 0
    },
    {
        id: 2,
        name: "李四",
        parentId: 0
    },
    {
        id: 3,
        name: "王五",
        parentId: 0
    },
];

想要得到的结果是这样子的:

const result = [
    {
        id: 1,
        name: "张三",
        parentId: 0,
        children: [
            {
                id: 4,
                name: "张三的儿子",
                parentId: 1,
                children: [
                    {
                        id: 6,
                        name: "张三的儿子的儿子",
                        parentId: 4
                    }
                ]
            },
            {
                id: 43,
                name: "张三的2儿子",
                parentId: 1
            }
        ]
    },
    {
        id: 2,
        name: "李四",
        parentId: 0,
        children: [
            {
                id: 5,
                name: "李四的儿子",
                parentId: 2
            }
        ]
    },
    {
        id: 3,
        name: "王五",
        parentId: 0
    }
];

这里我有两种做法:

递归

充分利用数据的引用(堆栈)

第一种:

function rescurve(arr, id) {
    let treeData = [];
    arr.forEach(i => {
        if(i.parentId == id) {
            treeData.push(i);
            i.children = rescurve(arr, i.id);
        }
    });
    return treeData;
};
console.log(rescurve(arr, 0)); // 输出正确的值

这种方法没什么说的 就是执行自身递归出想要的结构.

第二种:

function setTreeData(arr) {
    let map = {}; // 构建map
    arr.forEach(i => {
        map[i.id] = i; // 构建以id为键 当前数据为值
    });

    let treeData = [];
    arr.forEach(child => {
        const mapItem = map[child.parentId]; // 获取当前数据的parentId是否存在map中

        if (mapItem) { // 存在则表示当前数据不是最顶层数据
        
            // 注意: 这里的map中的数据是引用了arr的它的指向还是arr, 当mapItem改变时arr也会改变
            (mapItem.children || ( mapItem.children = [] )).push(child); // 这里判断mapItem中是否存在children, 存在则插入当前数据, 不存在则赋值children为[]然后再插入当前数据
        } else { // 不存在则是组顶层数据
            treeData.push(child);
        }
    });

    return treeData;
};

console.log(setTreeData(arr)); // 输出正确的值

这里需要注意的是对象的引用, 利用对象的引用改变指向的arr的数据. 就得到想要的结构

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/107745.html

相关文章

  • 递归算法造成的问题分析与解决

    摘要:整理一下,形成今天的内容算法中的递归算法。解决来看一下,最终形态的递归方法是什么样子递归运算创建树结构声明静态变量给静态变量累加值赋值闭合标签这样就可以解决了。所以,在之后的递归算法中,应该小心谨慎,避免出现问题。 原文是在我自己博客中,小伙伴也可以点阅读原文进行跳转查看,还有好听的背景音乐噢~     递归,在编码中应该算是一种很常见的算法了。之前在学习C语言的时候,也同样了解过一些...

    gekylin 评论0 收藏0
  • 算法算法图解笔记_递归

    递归是个有意思的概念,正如在前面所说,递归能让算法的可读性大大提高,而且通常要比使用循环结构更能写出准确的算法。这本书形象引入了递归,并没有太深入,所以我进行了一点添油加醋。 递归 概念 递归其实就是自己调用自己。可以从多种维度对递归分类,我见过的最常见的分类: 直接递归 自己直接调用自己。如: --haskell length :: [a] -> Int length [] = 0 length...

    tomlingtm 评论0 收藏0
  • 超优雅!node.js 无限分类,无递归获取所有下级分类ID。

    摘要:昨天帮同事解决问题,于是诞生了超优雅两行代码搞定无限级分类获取顶级分类这篇文章。这次要解决的问题是根据分类,获取所有下级分类的,这里说的所有下级分类,是包含下级下下级下下下级另外刚好在学习,于是用上了对象。 昨天帮同事解决问题,于是诞生了超优雅!两行代码搞定 php 无限级分类 获取顶级分类ID这篇文章。 晚上回家做自己的node.js项目的时候,又遇到关于无限级分类的问题了。其实也不...

    calx 评论0 收藏0
  • PHP中的无限分类无限嵌套评论

    摘要:可以看到,我们首先获取到了所有的数据,然后按照父级归类。无限嵌套评论先来看下这个无限嵌套评论长什么样子。文件扫描使用递归进行目录文件的扫描的栗子。 回顾 上一篇文章我们讲到实战PHP数据结构基础之递归。来回顾下什么是递归? 一般来说,递归被称为函数自身的调用。 递归在开发中的实际运用 N级分类 无限级的分类在平常的开发中是常见的需求,并且在不少面试题中都会碰到。不管你做什么项目,应该都...

    Shisui 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<