js如何高效丝滑地实现数组转树？10句关键代码即可实现

#实现思路#

1. 首先将子节点对应父节点到map上，父节点对应着数组，而数组存储其孩子节点
2. 再度遍历所有的节点，将所有的节点对应的子节点放在其children节点上
3. 返回根节点数组，即map[null]就是最终的结果

思路就这么简单，以下便是代码

<script>
    const arr = [
      { id: 1, name: "A", parentId: null },
      { 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 },
      { id: 7, name: "G", parentId: null },
    ];
    function arrToTree(arr) {
      /*
        将子节点对应到父节点的id上，如下
        {
          1: [
            { id: 2, name: "B", parentId: 1 },
            { id: 3, name: "C", parentId: 1 },
          ],
        };
      */
      let map = Object.create(null);
      for (let i = 0; i < arr.length; i++) {
        let item = arr[i];
        let parentId = item.parentId;
        map[parentId] === undefined && (map[parentId] = []);
        map[parentId].push(item);
      }

      for (let i = 0; i < arr.length; i++) {
        let item = arr[i];
        item.children = map[item.id];
      }
      return map[null];
    }
    let trees = arrToTree(arr);
    console.log(trees);
</script>