在JavaScript中,將列表轉換為樹結構是一種常見的操作,尤其是在處理需要層級展示的數據,如菜單、分類等。這通常涉及到遞歸函數和對象的引用。以下是一個簡單的例子,展示了如何將一個扁平化的列表轉換為多層級樹結構。
假設我們有以下這樣的列表,每個節點有一個 `id` 和一個 `parentId`,表示它的父節點的ID:
const list = [{ id: 1, parentId: null },{ id: 2, parentId: 1 },{ id: 3, parentId: 1 },{ id: 4, parentId: 2 },{ id: 5, parentId: 2 },{ id: 6, parentId: 3 },
];
我們的目標是將這個列表轉換成如下所示的樹結構:
const tree = [{id: 1,parentId: null,children: [{id: 2,parentId: 1,children: [{ id: 4, parentId: 2 },{ id: 5, parentId: 2 }]},{id: 3,parentId: 1,children: [{ id: 6, parentId: 3 }]}]}
];
以下是將列表轉換為樹的JavaScript函數:
function listToTree(items) {const rootItems = [];const lookup = {};for (const item of items) {const itemId = item['id'];const parentId = item['parentId'];if (!lookup[itemId]) lookup[itemId] = { ['children']: [] };lookup[itemId] = { ...item, children: lookup[itemId]['children'] };if (parentId === null) {rootItems.push(lookup[itemId]);} else {if (!lookup[parentId]) lookup[parentId] = { ['children']: [] };lookup[parentId]['children'].push(lookup[itemId]);}}return rootItems;
}
const tree = listToTree(list);
console.log(JSON.stringify(tree, null, 2));
這個函數首先創建一個空的對象 `lookup` 來存儲列表中每個元素的引用,并最終用它來構建樹。然后,它遍歷列表,對于每個元素,將其添加到 `lookup` 對象中,并根據其 `parentId` 將其作為子元素添加到相應的父元素中。最后,函數返回根元素數組 `rootItems`,它包含了整個樹結構。
?