JavaScript數組元素合并：將相同ID的元素合并到一個對象中
在數據處理中，經常需要將具有相同ID的數組元素合并成單個對象。本文提供一種JavaScript解決方案，將具有相同ID但屬性不同的數組元素，轉換成新的數組格式。
原始數據格式：
const list = [ { id: "202301", jine: 23, type: "晚餐" }, { id: "202301", jine: 87.5, type: "早餐" }, { id: "202301", jine: 1065.5, type: "中餐" }, { id: "202302", jine: 10, type: "晚餐" }, { id: "202302", jine: 181.5, type: "早餐" }, { id: "202302", jine: 633.5, type: "中餐" } ];
目標數據格式：
const targetList = [ { id: "202301", jine1: 87.5, jine2: 1065.5, jine3: 23 }, { id: "202302", jine1: 181.5, jine2: 633.5, jine3: 10 } ];
解決方案：
立即學習“Java免費學習筆記（深入）”；
我們將使用reduce方法實現數據轉換。該方法迭代數組，將每個元素累積到一個結果對象中。
const result = Object.values(list.reduce((acc, curr) => { const { id, jine, type } = curr; if (!acc[id]) { acc[id] = { id }; } switch (type) { case '早餐': acc[id].jine1 = jine; break; case '中餐': acc[id].jine2 = jine; break; case '晚餐': acc[id].jine3 = jine; break; } return acc; }, {})); console.log(result); // 輸出目標數據格式
代碼解釋：
- reduce方法: reduce方法迭代list數組，將每個元素累積到一個對象acc中。
- acc[id]: 使用id作為鍵，將數據存儲到acc對象中。如果id不存在，則創建一個新的對象。
- switch語句: 根據type屬性的值，將jine值分別賦值給jine1、jine2或jine3。
- Object.values: 最后，使用Object.values方法將acc對象轉換為數組，得到目標數據格式。
此方法清晰簡潔，避免了使用外部庫，直接利用JavaScript內置方法實現數據轉換。 它也更易于擴展，如果需要處理更多類型的餐飲，只需在switch語句中添加更多case即可。
? 版權聲明
文章版權歸作者所有，未經允許請勿轉載。
THE END
