【TypeScript】interface配列の数値プロパティの合計をreduceで求める

はじめに

TypeScriptで、interface に定義された数値プロパティを持つオブジェクトの配列から、
その合計値を求めたい場面があります。
この処理に便利な reduce メソッドについて、備忘録としてまとめます。

サンプルコード

interface Fruit {
  name: string;
  price: number;
}

const fruits: Fruit[] = [
  { name: 'Apple', price: 120 },
  { name: 'Banana', price: 80 },
  { name: 'Orange', price: 100 },
];

// reduceで合計を計算
const total = fruits.reduce((sum, fruit) => sum + fruit.price, 0);

console.log(total); // 300

reduceの実行イメージ

初期値: sum = 0

[ {Apple, 120}, {Banana, 80}, {Orange, 100} ]

1回目: sum = 0     + 120  → 120
2回目: sum = 120   + 80   → 200
3回目: sum = 200   + 100  → 300

最終結果: 300

ポイント

• reduce の第1引数は「累積値（sum）」、第2引数は「現在の要素（fruit）」
• 初期値（ここでは 0）を設定することで、型推論が正しく働き、空配列でもエラーにならない
• ループを書かずにシンプルに集計できる

おわりに

reduce を使えば、配列の合計や集計処理を簡潔に書くことができます。
実務でも頻繁に使う構文なので、サンプルコードと実行イメージをセットで覚えておくと便利です。

本記事が参考になれば幸いです。