从里向外获取祖级数据【一天一个算法陶冶情操 | 算法练习生第4天】

js 复制代码
// 这个我也不晓得是不是算法问题 反正是最近刚遇到的一个小场景: 通过一个key, 可以拿到它的祖级数据,然后做一个类似面包屑的输出
// 写一个函数, 参数1为一个Array的tree数据(包含key, value, children), 参数2为一个key(key为tree里某一层级的key), 输出以'/'连接的字符串

/**
 * 简析
 * 定义了一个key value键值对
 * loops实现了键值对的填充, 使各层级的数据都通过key可以直接拿到
 * 在loops中通过对node的封装, 可以实现获取祖级所有元素, 例如key, label等
 * getPath通过先拿到最小单位的数据, 通过loopsf=封装的parent字段, 拿到与父级的关系,然后通过while与valueMap结合, 实现依次向上获取父级元素, 通过unshift依次向前填充祖级数据,遇到undefined结束
 */
const getFullPath = (dataList, findKey) => {
  const valueMap = {}
  function loops(list, parent) {
    return (list || []).map(({ children, key, label }) => {
      const node = (valueMap[key] = {
        parent,
        key,
        label
      })
      node.children = loops(children, node)
      return node
    })
  }
  loops(dataList)
  function getPath(key) {
    const path = []
    let current = valueMap[key]
    while (current) {
      path.unshift(current.label)
      current = current.parent
    }
    return path || []
  }
  return getPath(findKey)
}
const data = [
  {
    label: '超人前传',
    key: 'superman',
    children: [
      {
        label: '第一季',
        key: 'superman-1',
        children: [
          {
            label: '第一集',
            key: 'superman-1-1'
          },
          {
            label: '第二集',
            key: 'superman-1-2'
          },
          {
            label: '第三集',
            key: 'superman-1-3'
          },
          {
            label: '第四集',
            key: 'superman-1-4'
          },
          {
            label: '第五集',
            key: 'superman-1-5'
          },
          {
            label: '第六集',
            key: 'superman-1-6'
          }
        ]
      },
      {
        label: '第二季',
        key: 'superman-2',
        children: [
          {
            label: '第一集',
            key: 'superman-2-1'
          },
          {
            label: '第二集',
            key: 'superman-2-2'
          },
          {
            label: '第三集',
            key: 'superman-2-3'
          },
          {
            label: '第四集',
            key: 'superman-2-4'
          },
          {
            label: '第五集',
            key: 'superman-2-5'
          },
          {
            label: '第六集',
            key: 'superman-2-6'
          }
        ]
      },
      {
        label: '第三季',
        key: 'superman-3',
        children: [
          {
            label: '第一集',
            key: 'superman-3-1'
          },
          {
            label: '第二集',
            key: 'superman-3-2'
          },
          {
            label: '第三集',
            key: 'superman-3-3'
          },
          {
            label: '第四集',
            key: 'superman-3-4'
          },
          {
            label: '第五集',
            key: 'superman-3-5'
          },
          {
            label: '第六集',
            key: 'superman-3-6'
          }
        ]
      }
    ]
  }
]
let result = getFullPath(data, 'superman-3-2')
console.log(result) // output: [ '超人前传', '第三季', '第二集' ]
相关推荐
Qrun2 分钟前
Windows11安装nvm管理node多版本
前端·vscode·react.js·ajax·npm·html5
中国lanwp3 分钟前
全局 npm config 与多环境配置
前端·npm·node.js
JELEE.1 小时前
Django登录注册完整代码(图片、邮箱验证、加密)
前端·javascript·后端·python·django·bootstrap·jquery
电鱼智能的电小鱼2 小时前
基于电鱼 AI 工控机的智慧工地视频智能分析方案——边缘端AI检测,实现无人值守下的实时安全预警
网络·人工智能·嵌入式硬件·算法·安全·音视频
孫治AllenSun3 小时前
【算法】图相关算法和递归
windows·python·算法
TeleostNaCl3 小时前
解决 Chrome 无法访问网页但无痕模式下可以访问该网页 的问题
前端·网络·chrome·windows·经验分享
格图素书4 小时前
数学建模算法案例精讲500篇-【数学建模】DBSCAN聚类算法
算法·数据挖掘·聚类
前端大卫5 小时前
为什么 React 中的 key 不能用索引?
前端
DashVector5 小时前
向量检索服务 DashVector产品计费
数据库·数据仓库·人工智能·算法·向量检索
AI纪元故事会5 小时前
【计算机视觉目标检测算法对比:R-CNN、YOLO与SSD全面解析】
人工智能·算法·目标检测·计算机视觉