js 数据遍历问题

Question

   const arr = [
        {
          id: 1,
          name: "张三",
          children: [
            {
              id: 1.1,
              name: "张四",
              children: [{ id: 1.11, name: "张五" }]
            }
          ]
        }
      ];

已知张五id，怎么拿到张四id

已知张四id,怎么拿到张三id

Answer 1

使用递归遍历实现：

  function findId(arr, id, pid) {
      for (let i = 0; i < arr.length; i++) {
        let item = arr[i].children
        if (arr[i].id === id) {
            prevId = pid
            break
        }
        if (item) {
            findId(item, id, arr[i].id)
        }
      }
    return prevId
  }
  console.log(findId(arr, 1.11, ''))

Answer 2

直接点，给代码。

function findParentId(id) {
    let arrMap = new Map();
    function patchArr(arr, pid = null) {
        arr.forEach(element => {
            arrMap.set(element.id,{ ...element, pid })
            element.children && (patchArr(element.children, element.id))
        });
    }
    patchArr(arr)
    return arrMap.get(id).pid;
}

console.log(findParentId(1.11)); // 1.1

Answer 3

function findChild(condition, children, parent = null) {
    for (let child of children) {
        if (condition(child)) {
            return parent;
        } else {
            if (child.children) {
                return findChild(condition, child.children, child);
            } else {
                return null;
            }
        }
    }
}

使用方式：

Answer 4

试试我写的树操作库，一两行代码就可以实现：https://github.com/Lushenggang/js-tree-tool

// 一次性找到所有祖先节点
const path = treeTool.findPath(arr, n => n.id == 1.11)
const result = path.map(node => node.id) // [1, 1.1, 1.11]

---

当然，了解实现方法还是有必要的，代码实现在这篇文章中有写：
https://wintc.top/article/20