第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時(shí)綁定郵箱和手機(jī)立即綁定

【九月打卡】第15天 解決問題(4)

標(biāo)簽:
JavaScript

课程名称2周刷完100道前端优质面试真题
课程章节:第9章 前端面试技能拼图7 :分析和解决问题的思路 - 可以独立解决问题
主讲老师双越
课程内容
今天学习的内容包括:
9-5 -把一个数组转换为树(11:26)
9-6 -【连环问】把一个树转换为数组
这一章主要是讲分析解决问题,避免踩坑。

课程收获
这两节主要是树和数组的相互转换。

  • 数组转树

课程提供的方法对应数组本身已按 parentId 排序后的方法。
思路:

  • 用 map 存储 id 和 子树之间的关系。由于已按 parentId 排序,故当前节点一定可在 map 找到父节点。
  • 遍历数组,依次把当前节点存入 map,把当前节点放入父节点 children, 判断当前节点是否为根节点。
      const arr2Tree = (arr) => {
        let root = null;
        const map = new Map();
        arr.forEach((ele) => {
          const { id, name, parentId } = ele;
          const node = {
            id,
            name,
          };
          map.set(id, node);
          const pNode = map.get(parentId);
          if (pNode) {
            pNode.children
              ? pNode.children.push(node)
              : (pNode.children = [node]);
          }
          if (parentId === 0) {
            root = node;
          }
        });
        return root;
      };
      const arr = [
        { id: 1, name: "部门A", parentId: 0 }, // 0 代表顶级节点,无父节点
        { id: 2, name: "部门B", parentId: 1 },
        { id: 3, name: "部门C", parentId: 1 },
        { id: 4, name: "部门D", parentId: 2 },
        { id: 5, name: "部门E", parentId: 2 },
        { id: 6, name: "部门F", parentId: 3 },
      ];
      const tree = arr2Tree(arr);
      console.info(tree);
  • 树转数组

课程提供的思路为以map存储当前节点和父节点的映射。
广度优先遍历树结构,用队列把当前节点和子节点一层层入队。子节点入队时存储与父节点的关系。

      const tree2Arr = (root) => {
        if (!root) return [];
        const map = new Map();
        let arr = [];
        let queue = [root];
        while(queue.length > 0) {
          const node = queue.shift();
          if (!node) {
            break;
          }
          const { id, name, children = [] } = node;
          const pNode = map.get(node);
          const parentId = pNode?.id || 0;
          arr.push({
            id,
            name,
            parentId,
          })
          if (children.length) {
            children.forEach(ele => {
              map.set(ele, node);
            });
            queue = queue.concat(children);
          }
        }
        return arr;
      }
      const arrRes = tree2Arr(JSON.parse(JSON.stringify(tree)));
      console.info(arrRes);

以上结束。

點(diǎn)擊查看更多內(nèi)容
TA 點(diǎn)贊

若覺得本文不錯(cuò),就分享一下吧!

評論

作者其他優(yōu)質(zhì)文章

正在加載中
  • 推薦
  • 評論
  • 收藏
  • 共同學(xué)習(xí),寫下你的評論
感謝您的支持,我會繼續(xù)努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進(jìn)行掃碼打賞哦
今天注冊有機(jī)會得

100積分直接送

付費(fèi)專欄免費(fèi)學(xué)

大額優(yōu)惠券免費(fèi)領(lǐng)

立即參與 放棄機(jī)會
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號

舉報(bào)

0/150
提交
取消