从里向外获取祖级数据【一天一个算法陶冶情操 | 算法练习生第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: [ '超人前传', '第三季', '第二集' ]
相关推荐
web打印社区10 小时前
网页静默打印热敏小票:从 HTML 到出纸的完整指南
前端·javascript·vue.js·electron·pdf·html
剪刀石头布啊11 小时前
设计一个多计时任务的任务管理功能
前端
ModyQyW11 小时前
vite-plugin-uni-manifest 更新了什么
前端·typescript·uni-app
Asize13 小时前
AI 协作开发新范式:我用 SDD 做了个排版 npm 包
前端·人工智能
kyriewen14 小时前
我把今年流传的前端 AI 面试题整理了一遍——4 类场景题+回答框架(附速查表)
前端·面试·程序员
计算机魔术师14 小时前
国产多模态模型正面硬刚Opus旗舰:差距从30%缩到3%
前端
风骏时光牛马15 小时前
程序员进阶:深度思考,解锁职场成长的底层逻辑
前端
IT_陈寒15 小时前
用了Proxy才发现以前的JavaScript白写了
前端·人工智能·后端
爱丶不疚15 小时前
Eval: Agent 说的 Eval 是什么?从单测、TDD 到 Sentry 聊起
前端·ai编程·vibecoding
求道於盲15 小时前
python中的类型标注
前端