js for循环把tree结构转换为list

Question

假设有这样一个data，我需要把children提取出来与外面那层同级，然后去除children，也就是说我需要整个data只有一级只有一层，然后这里面children里的pid要等于父级的id。
sort排序从0开始，比如label为“1”的父级底下的children里有两条数据，这两条children里的sort从0开始到1。
同样的，如果同时另外一个label为“2”的父级底下的children里有两条数据，他这两条children里的sort也是从0开始到1。

ps：data中的其他key、value不可动，要保留住，例如label

原始↓ ：

data:  [{
          id: '1',
          label: '1',
          sort: 1,
          children:[{ pid: null, label: '1-1', sort: null },{ pid: null, label: '1-2', sort: null },]
        },{
          id: '2',
          label: '2',
          sort: 2,
          children:[{ pid: null, label: '2-1', sort: null },{ pid: null, label: '2-2', sort: null },]
        }]

理想↓：

       [{ id: '1', label: '1', sort: 1 },
        { pid: '1', label: '1-1', sort: 0 },
        { pid: '1', label: '1-2', sort: 1 },
        { id: '2', label: '2', sort: 2 },
        { pid: '2', label: '2-1', sort: 0 },
        { pid: '2', label: '2-2', sort: 1 }]

说的可能有点乱，大婶们如果没听懂我在说啥请轻喷，麻烦你们了！！

Answer 1

let data = [{
          id: '1',
          label: '1',
          sort: 1,
          children:[{ pid: null, label: '1-1', sort: null },{ pid: null, label: '1-2', sort: null },]
        },{
          id: '2',
          label: '2',
          sort: 2,
          children:[{ pid: null, label: '2-1', sort: null },{ pid: null, label: '2-2', sort: null },]
        }]
        
       let b = data.flatMap(i=>{i.children.map((j,index)=>{j.pid = i.id;j.sort=index});let a = i.children;delete i.children;a.unshift(i);console.log(a);return a});
       console.log(b);

Answer 2

function listToTree (list) {
  const result = [], l = [...list]
  while (l.length) {
    const node = { ...l.shift() }
    const children = node.children && node.children.map((d, idx) => ({ ...d, sort: idx, pid: node.id }))
    children && l.unshift(children)
    delete node.children
    result.push(node)
  }
  return result
}

测试：

const res = listToTree(data)
console.log(JSON.stringify(res, null, 2))

输出：

[
  {
    "id": "1",
    "label": "1",
    "sort": 1
  },
  {
    "0": {
      "pid": "1",
      "label": "1-1",
      "sort": 0
    },
    "1": {
      "pid": "1",
      "label": "1-2",
      "sort": 1
    }
  },
  {
    "id": "2",
    "label": "2",
    "sort": 2
  },
  {
    "0": {
      "pid": "2",
      "label": "2-1",
      "sort": 0
    },
    "1": {
      "pid": "2",
      "label": "2-2",
      "sort": 1
    }
  }
]

各种树结构转换可以看这里：
https://github.com/Lushenggan...

Answer 3

给个思路，对每一个根节点用深度优先展开子节点，展开过程中子节点pid为根节点id，sort递增

Answer 4

function flat(list) {
    function exclude(key, obj) {
        const cp = {...obj};
        delete cp[key]
        return cp;
    }
    function merge(target, source) {
        return Object.keys(source).reduce((res, k) => {
            const value = source[k]
            if(value!=null && value!= undefined) res[k] = value;
            return res;
        }, target)
    }
    return list.map(item => item.children.map(child => merge(exclude('children',item), child))).flat()
}

Answer 5

我的菜鸡做法。。

let data = [{
          id: '1',
          label: '1',
          sort: 1,
          children:[{ pid: null, label: '1-1', sort: null },{ pid: null, label: '1-2', sort: null },]
        },{
          id: '2',
          label: '2',
          sort: 2,
          children:[{ pid: null, label: '2-1', sort: null },{ pid: null, label: '2-2', sort: null },]
        }]

let newData = [];
function func(data,id = null) {
    for(let i = 0 ; i< data.length; i++) {
        let obj = {};
        if (id === null){
            obj['id'] = data[i].id;         
            obj['label'] = data[i].label;   
            obj['sort'] = data[i].sort; 
        } else {
            obj['pid'] = id;    
            obj['label'] = data[i].label;     
            obj['sort'] = i; 
        }    
        newData.push(obj);
        if (data[i].children && data[i].children.length >= 1){
            func(data[i].children,data[i].id)            
        }
    }
}
func(data);
console.log(newData)