JavaScript 對象數組轉換詳解
本文介紹如何將一個鍵值對形式的 JavaScript 對象,其中值是子數組,轉換為一個對象數組。每個對象包含鍵名、ID 和對應的子對象數組。這種轉換在處理層級數據,例如將扁平數據轉換為樹形結構時非常有用。
原始數據結構:
假設原始數據結構如下:
const obj = { "a": ["a1", "a2"], "b": ["b1", "b2", "b3"] };
目標數據結構:
立即學習“Java免費學習筆記(深入)”;
目標是將其轉換為以下結構:
const list = [ { id: 1, name: 'a', childList: [{ id: 3, name: 'a1' }, { id: 4, name: 'a2' }] }, { id: 2, name: 'b', childList: [{ id: 5, name: 'b1' }, { id: 6, name: 'b2' }, { id: 7, name: 'b3' }] } ];
實現方法:
我們可以利用 Object.entries 和 reduce 方法高效地完成轉換。以下代碼展示了轉換過程:
let obj = { "a": ["a1", "a2"], "b": ["b1", "b2", "b3"] }; let id = 1; const list = Object.entries(obj).reduce((acc, [name, val]) => { acc.push({ id: id++, name, childList: val.map(childName => ({ id: id++, name: childName })) }); return acc; }, []);
這段代碼首先使用 Object.entries 將對象轉換為鍵值對數組。然后,reduce 方法迭代每個鍵值對,創建一個新對象。新對象包含 id(從 1 開始遞增)、name(來自原始對象的鍵)和 childList(通過 map 方法將原始數組中的每個元素轉換為包含 id 和 name 的新對象)。id 在整個過程中持續遞增,確保每個子對象都有唯一的 ID。最終,reduce 方法返回包含所有轉換后對象的數組。
通過這種方法,我們可以輕松地將復雜的鍵值對子數組對象轉換為更易于管理和操作的對象數組。
? 版權聲明
文章版權歸作者所有,未經允許請勿轉載。
THE END
喜歡就支持一下吧
相關推薦