JavaScript：列表转树型结构-优快云博客

本文介绍如何将JavaScript中的列表数据转换为树型结构。通过创建一个以id为键的临时对象temp，然后遍历该对象，将非顶级节点添加到其父节点的children数组中，最终形成树形结构。在遍历过程中，即使顶级节点先被添加到结果数组，后续的子节点依然能正确地被添加到对应的父节点下，因为JavaScript对象引用同一内存地址，确保了数据的完整性。

话不多说，直接进入正题~

列表数据中字段如下：

[
    {
        id: 1,
        text: '节点1',
        parentId: 0 //这里用0表示为顶级节点
    },
    {
        id: 2,
        text: '节点1_1',
        parentId: 1 //通过这个字段来确定子父级
    }
    ...   
]

我们预期的结果：

[
    {
        id: 1,
        text: '节点1',
        parentId: 0,
        children: [
            {
                id:2,
                text: '节点1_1',
                parentId:1
            }
        ]
    }
]

先说一下实现的思路：
1、先把列表数据转成以id为key，节点本身为value的对象temp；
2、定义空列表treeData，然后遍历temp对象
2-1、如果当前节点不是顶级节点（parentId不为0），那找到以parentId作为key的节点，并把当前节点push到该节点的children中；
2-2、如果当前节点是顶级节点，只需把该节点push到treeData中,当temp遍历结束后，treeData就是最后的树型数据。

具体代码：

var temp = {};
var treeData = [];
for(var i=0; i<data.length; i++){
    temp[data[i].id] = data[i];
}
for(var i in temp){
     if(temp[i].parentId != "") {
         if(!temp[temp[i].parentId].children) {
             temp[temp[i].parentId].children = new Array();
         }
         temp[temp[i].parentId].children.push(temp[i]);
     } else {
         treeData.push(temp[i]);
     }
}

这里特别说一下有个稍微底层一点的东东，也是该方法实现的关键所在。。
大家想一想，逐步跟一下这个过程，在遍历temp时，假如顶级节点1先被push到了treeData中，而后面又有子节点被添加到了节点1中，那么这个子节点最后能不能被带入到treeData中的节点1里呢？

答案是可以的~

因为节点1本身是个Object对象，它指向了一个内存地址，而无论后续节点1怎么改变，被push到treeData中的节点1都会指向同一个地址，所以节点1被什么时候push都没有关系，最后就是完整的数据。