用递归把扁平化数据转成树型结构

原始数据如下：

const data = [
  { id: 2, pid: 0, name: "England", cn: "英超联赛" },
  { id: 3, pid: 2, teamName: "Arsenal", cn: "阿森纳" },
  { id: 4, pid: 3, playName: "Aubameyang", cn: "奥巴梅杨" },
  { id: 5, pid: 2, teamName: "manchesterUnited", cn: "曼联" },
  { id: 6, pid: 0, name: "Spain", cn: "西甲联赛" },
  { id: 7, pid: 6, playName: "Espanyol", cn: "西班牙人"},
  { id: 8, pid: 6, name: "RealMadrid", cn: "皇马" },
  { id: 9, pid: 7, playName: "Wulei", cn: "武磊"},
  { id: 10, pid: 3, playName: "peipei", cn: "佩佩"},
];

如果该对象pid等于数组中“其他对象”的id，那么就在对应的“其他对象”里面加个属性children（数组），把该对象push进去。解决方法：

方法一：

let resultTreeArray = formatToTree(data);

function formatToTree(data) {
  let father = data.filter((f) => f.pid === 0);
  let child = data.filter((c) => c.pid !== 0);
  dataToTree(father, child);
  return father;
}

function dataToTree(father, child) {
  father.map((f) => {
    child.map((c, i) => {
      if (f.id === c.pid) {
        let _child = JSON.parse(JSON.stringify(child));
        _child.splice(i, 1);
        dataToTree([c], _child);
        if (f.children) {
          f.children.push(c);
        } else {
          f.children = [c];
        }
      }
    });
  });
}

方法二：

<button id="btn">点我totree</button>
<script>
    //const data = 原始数组;
    const btn = document.getElementById('btn')
    btn.onclick = () => {
      const result = dataToTree(data, 0, [])
      console.log(JSON.stringify(result))
    }
    function dataToTree(dataList, id, list) {
      for (let item of dataList) {
        if (item.pid === id) {
          list.push(item);
        }
      }
      for (let i of list) {
        i.children = [];
        dataToTree(dataList, i.id, i.children);
      }
      return list
    }
</script>