JavaScriptでもフィールドの1つをマージしながら配列を縮小する方法
次のオブジェクトの配列があるとします-
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'
}]; たとえば、このような配列を取り込んで、common idプロパティに基づいてマージする関数を作成する必要があります。趣味のプロパティには、配列を割り当て、特定の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' ] }
] -
JavaScriptでIDごとにオブジェクトの配列をグループ化する方法は?
以下は、JavaScriptでオブジェクトの配列をIDでグループ化するコードです- 例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style>
-
ボタンクリック時にJavaScript配列アイテムを一度に1つずつ逆に表示するにはどうすればよいですか?
以下が私たちの配列だとしましょう- var listOfNames = [ 'John', 'David', 'Bob' ]; 以下は私たちのボタンです- <button id="reverse" onclick="reverseTheArray()">Click The Button To get the Reverse Value</button> ここで、逆の配列アイテムの場合、最初に配列の長さに