JavaScriptで同じキーを持つ配列の値を合計する方法
ここでは、ある企業が一定期間に売買した株式に関するデータを格納した配列を例に考えてみましょう。
const transactions = [
['AAPL', 'buy', 100],
['WMT', 'sell', 75],
['MCD', 'buy', 125],
['GOOG', 'sell', 10],
['AAPL', 'buy', 100],
['AAPL', 'sell', 100],
['AAPL', 'sell', 20],
['DIS', 'buy', 15],
['MCD', 'buy', 10],
['WMT', 'buy', 50],
['MCD', 'sell', 90]
];この配列の各要素は、[銘柄名、売買の種類(buy/sell)、数量]という形式になっています。
実現したいこと
このデータを受け取り、銘柄名('AAPL'や'MCD'など)をキーとし、値として2つの数値からなる配列を持つオブジェクトを返す関数を作成します。配列の1番目の要素は買い(buy)の合計数量、2番目の要素は売り(sell)の合計数量を表します。
このような集計処理には、Array.prototype.reduce()メソッドが最適です。reduceを使えば、配列を走査しながら結果を1つのオブジェクトに蓄積していくことができます。
サンプルコード
const transactions = [
['AAPL', 'buy', 100],
['WMT', 'sell', 75],
['MCD', 'buy', 125],
['GOOG', 'sell', 10],
['AAPL', 'buy', 100],
['AAPL', 'sell', 100],
['AAPL', 'sell', 20],
['DIS', 'buy', 15],
['MCD', 'buy', 10],
['WMT', 'buy', 50],
['MCD', 'sell', 90]
];
const digestTransactions = (arr) => {
return arr.reduce((acc, val, ind) => {
const [stock, type, amount] = val;
if(acc[stock]){
const [buy, sell] = acc[stock];
if(type === 'buy'){
acc[stock] = [buy+amount, sell];
}else{
acc[stock] = [buy, sell+amount];
}
}else{
if(type === 'buy'){
acc[stock] = [amount, 0];
}else{
acc[stock] = [0, amount];
}
}
return acc;
}, {});
};
console.log(digestTransactions(transactions));コードの解説
このコードの処理の流れは以下の通りです。
- 初期値として空のオブジェクト
{}をreduceメソッドに渡し、そこに結果を蓄積していきます。 - 各トランザクションは分割代入(
const [stock, type, amount] = val;)によって、銘柄名・種類・数量に分解されます。 - アキュムレータ(
acc)にその銘柄のキーがすでに存在する場合は、既存の買い・売りの合計値に新しい数量を加算して更新します。 - キーがまだ存在しない場合は、'buy'なら
[amount, 0]、'sell'なら[0, amount]という形で新しいエントリを初期化します。
実行結果
コンソールには以下のように出力されます。
{
AAPL: [ 200, 120 ],
WMT: [ 50, 75 ],
MCD: [ 135, 90 ],
GOOG: [ 0, 10 ],
DIS: [ 15, 0 ]
}たとえばAAPLの場合、買いが100+100=200、売りが100+20=120となっており、正しく集計されていることがわかります。このようにreduceメソッドを活用することで、グループごとの合計値を簡潔かつ効率的に計算できます。
-
JavaScriptのArray.values()メソッドとは?使い方とサンプルコードを徹底解説
JavaScriptのArray.values()メソッドとは? JavaScriptのArray.values()メソッドは、対象の配列に含まれるすべての値を格納したイテレーターオブジェクトを返します。ES2015(ES6)以降で利用可能なこのメソッドは、for...ofループやスプレッド構文([...arr])と組み合わせることで、配列の各要素を効率的に取り出せます。 なお、keys()やentries()がインデックス情報も一緒に返すのに対し、values()は純粋に「値」だけを順番に提供する点が大きな特徴です。 基本構文 arr.values() 引数は不要で、戻り値として新しいArr
-
【JavaScript】配列内のネストされたオブジェクトの値を合計する方法
この記事では、JavaScriptを使って、配列内にネストされた(入れ子構造の)オブジェクトの値を合計する方法を解説します。サンプルコードでは、JSONデータの複数階層に格納された数値(costNum)を順番に取り出し、その合計をブラウザ上に表示します。 コード例 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=d