簡體   English   中英

使用級別和名稱信息的樹層次結構使用 javascript

[英]Tree hierarchy using level and name information using javascript

我有以下平面數據數組,主要是級別,並且是有序的。 基於級別,我需要創建一個樹層次數組。

以下是輸入:

[
    {
        "position": "CEO",
        "level": 1,
        "name": "Adam"
    },
    {
        "position": "President",
        "level": 2,
        "name": "Eva"
    },
    {
        "position": "Senior Vice President",
        "level": 3,
        "name": "Thein"
    },
    {
        "position": "Vice President",
        "level": 4,
        "name": "Rick"
    },
    {
        "position": "Vice President",
        "level": 4,
        "name": "Rosh"
    },
    {
        "position": "Vice President",
        "level": 4,
        "name": "Jenny"
    },
    {
        "position": "Vice President",
        "level": 4,
        "name": "Tim"
    },
    {
        "position": "Vice President",
        "level": 4,
        "name": "Gin"
    },
    {
        "position": "President",
        "level": 2,
        "name": "Nisham"
    },
    {
        "position": "Senior Vice President",
        "level": 3,
        "name": "Gil"
    },
    {
        "position": "Vice President",
        "level": 4,
        "name": "Lew"
    },
    {
        "position": "Vice President",
        "level": 4,
        "name": "Dan"
    },
    {
        "position": "Vice President",
        "level": 4,
        "name": "Henry"
    }
]

而預期的 output 是:

[
    {
        "position": "CEO",
        "level": 1,
        "name": "Adam",
        "children": [
            {
                "position": "President",
                "level": 2,
                "name": "Eva",
                "children": [
                    {
                        "position": "Senior Vice President",
                        "level": 3,
                        "name": "Thein",
                        "children":[
                            {
                                "position": "Vice President",
                                "level": 4,
                                "name": "Rick"
                            },
                            {
                                "position": "Vice President",
                                "level": 4,
                                "name": "Rosh"
                            },
                            {
                                "position": "Vice President",
                                "level": 4,
                                "name": "Jenny"
                            },
                            {
                                "position": "Vice President",
                                "level": 4,
                                "name": "Tim"
                            },
                            {
                                "position": "Vice President",
                                "level": 4,
                                "name": "Gin"
                            }
                        ]
                    }
                ]
            },
            {
                "position": "President",
                "level": 2,
                "name": "Nisham",
                "children":[
                    {
                        "position": "Senior Vice President",
                        "level": 3,
                        "name": "Gil",
                        "children":[
                            {
                                "position": "Vice President",
                                "level": 4,
                                "name": "Lew"
                            },
                            {
                                "position": "Vice President",
                                "level": 4,
                                "name": "Dan"
                            },
                            {
                                "position": "Vice President",
                                "level": 4,
                                "name": "Henry"
                            }
                        ]
                    }
                ]
            }

        ]
    }
]

我遇到了很多堆棧,但它們都有一個 id 和 parent_id 作為鏈接。 但是,在此數據中,數組項之間沒有 id 鏈接。

到目前為止,我嘗試了以下代碼:

let root = {};
    let i = 0;
    data.forEach(el => {
        if (el["level"] == 1) {
            root = el;
            root.children = [];
        }
        if (el["level"] == 2) {
            root.children.push(el);
            root.children[i].children = [];
        }
        if (el["level"] == 3) {
            root.children[i].children.push(el);
            root.children[i].children[i].children = [];
        }
        if (el["level"] == 4) {
            root.children[i].children[i].children.push(el);
            root.children[i].children[i].children[i].children = [];
        }
        i++;
    });

第一次通過它會給出 output,但稍后會拋出錯誤。 我知道這是不對的,而且關卡是硬編碼的,但這是迄今為止的嘗試。

您可以通過使用保留最后插入對象的所有級別的級別數組來使用幾乎單線。

 const data = [{ position: "CEO", level: 1, name: "Adam" }, { position: "President", level: 2, name: "Eva" }, { position: "Senior Vice President", level: 3, name: "Thein" }, { position: "Vice President", level: 4, name: "Rick" }, { position: "Vice President", level: 4, name: "Rosh" }, { position: "Vice President", level: 4, name: "Jenny" }, { position: "Vice President", level: 4, name: "Tim" }, { position: "Vice President", level: 4, name: "Gin" }, { position: "President", level: 2, name: "Nisham" }, { position: "Senior Vice President", level: 3, name: "Gil" }, { position: "Vice President", level: 4, name: "Lew" }, { position: "Vice President", level: 4, name: "Dan" }, { position: "Vice President", level: 4, name: "Henry" }], result = [], levels = [result]; data.forEach(o => levels[o.level - 1].push({...o, children: levels[o.level] = []})); console.log(result);
 .as-console-wrapper { max-height: 100%;important: top; 0; }

沒有未使用的子代 arrays 的方法。

 const data = [{ position: "CEO", level: 1, name: "Adam" }, { position: "President", level: 2, name: "Eva" }, { position: "Senior Vice President", level: 3, name: "Thein" }, { position: "Vice President", level: 4, name: "Rick" }, { position: "Vice President", level: 4, name: "Rosh" }, { position: "Vice President", level: 4, name: "Jenny" }, { position: "Vice President", level: 4, name: "Tim" }, { position: "Vice President", level: 4, name: "Gin" }, { position: "President", level: 2, name: "Nisham" }, { position: "Senior Vice President", level: 3, name: "Gil" }, { position: "Vice President", level: 4, name: "Lew" }, { position: "Vice President", level: 4, name: "Dan" }, { position: "Vice President", level: 4, name: "Henry" }], result = [], levels = [{ children: result }]; data.forEach(function (o) { levels[o.level - 1].children = levels[o.level - 1].children || []; levels[o.level - 1].children.push(levels[o.level] = o); }); console.log(result);
 .as-console-wrapper { max-height: 100%;important: top; 0; }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM