將有父子關系的數組對象轉換成樹形結構數據

原數據：

data: [{
    id: 1,
    name: '1',
},
{
    id: 2,
    name: '1-1',
    parentId: 1
},
{
    id: 3,
    name: '1-1-1',
    parentId: 2
},
{
    id: 4,
    name: '1-2',
    parentId: 1
},
{
    id: 5,
    name: '1-2-2',
    parentId: 4
},
{
    id: 6,
    name: '1-1-1-1',
    parentId: 3
},
{
    id: 7,
    name: '2',
    parentId: ''
},
{
    id: 8,
    name: '3'
},
{
    id: 9,
    name: '3-1',
    parentId: 7
}
]

轉換方法：

/**
 * 該方法用於將有父子關系的數組轉換成樹形結構的數組
 * 接收一個具有父子關系的數組作為參數
 * 返回一個樹形結構的數組
 */
translateDataToTree(data) {
    // 沒有父節點的數據
    let parents = data.filter(value => value.parentId == 'undefined' || value.parentId == null ||
        value.parentId ==
        '')
    // 有父節點的數據
    let children = data.filter(value => value.parentId !== 'undefined' && value.parentId !=
        null || value.parentId !=
        '')
    // 定義轉換方法的具體實現
    let translator = (parents, children) => {
        // 遍歷父節點數據
        parents.forEach((parent) => {
            // 遍歷子節點數據
            children.forEach((current, index) => {
                // 此時找到父節點對應的一個子節點
                if (current.parentId === parent.id) {
                    // 對子節點數據進行深復制，這里只支持部分類型的數據深復制，對深復制不了解的童靴可以先去了解下深復制
                    let temp = JSON.parse(JSON.stringify(children))
                    // 讓當前子節點從temp中移除，temp作為新的子節點數據，這里是為了讓遞歸時，子節點的遍歷次數更少，如果父子關系的層級越多，越有利
                    temp.splice(index, 1)
                    // 讓當前子節點作為唯一的父節點，去遞歸查找其對應的子節點
                    translator([current], temp)
                    // 把找到子節點放入父節點的children屬性中
                    typeof parent.children !== 'undefined' ? parent.children
                        .push(
                            current) :
                        parent.children = [current]
                }
            })
        })
    }
    // 調用轉換方法
    translator(parents, children)
    // 返回最終的結果    
    return parents;
}