如何在 JavaScript 中同時減少陣列以及合併其一個欄位
假設我們有一個以下物件陣列 -
const arr = [{
id: 121,
hobby: 'cycling'
}, {
id: 125,
hobby: 'jogging'
}, {
id: 129,
hobby: 'reading'
}, {
id: 121,
hobby: 'writing'
}, {
id: 121,
hobby: 'playing football'
}, {
id: 125,
hobby: 'cooking'
}, {
id: 129,
hobby: 'horse riding'
}];假設我們必須編寫一個函式,該函式接收這樣的陣列並根據公共的 id 屬性合併該陣列,並且我們為 hobby 屬性分配一個數組,並將特定 ID 的所有愛好放入其中。
我們將使用 Array.prototype.reduce() 方法來遍歷陣列並同時合併具有相同索引的條目。
用於執行此操作的程式碼如下 -
示例
const arr = [{
id: 121,
hobby: 'cycling'
}, {
id: 125,
hobby: 'jogging'
}, {
id: 129,
hobby: 'reading'
}, {
id: 121,
hobby: 'writing'
}, {
id: 121,
hobby: 'playing football'
}, {
id: 125,
hobby: 'cooking'
}, {
id: 129,
hobby: 'horse riding'
}];
const mergeArray = (arr) => {
return arr.reduce((acc, val) => {
const ind = acc.findIndex(item => item.id === val.id);
if(ind !== -1){
acc[ind].hobby.push(val.hobby);
}else{
acc.push({
id: val.id,hobby: [val.hobby]
});
};
return acc;
}, []);
};
console.log(mergeArray(arr));輸出
控制檯中的輸出將為 -
[
{ id: 121, hobby: [ 'cycling', 'writing', 'playing football' ] },
{ id: 125, hobby: [ 'jogging', 'cooking' ] },
{ id: 129, hobby: [ 'reading', 'horse riding' ] }
]
廣告
資料結構
網路
RDBMS
作業系統
Java
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP