JavaScriptやTypeScriptでTotal(合計)を計算する方法

JavaScript

JavaScriptやTypeScriptでTotal(合計)を計算したい!

業務でNodeを使ってツールを作成した際に合計を取得したい時がありましたのでまとめておきます。

  • 平均を取得したい!
  • 中央値を取得したい!

という場合は、こちらに記事にまとめておきましたのでこちらを参照してください!

JavaScriptやTypeScriptで合計を出す方法

合計を求めるのにいくつか方法があると思いますので、それぞれ解説していきます!

for文を使う場合

まずはfor文を使う場合となります。

一番基本的な書き方ですね!

const numbers = [0, 1, 2, 3]

let total = 0
for (let i = 0; i < numbers.length; i++) {
  total += numbers[i]
}

// 6
console.log(total)

forEachを使う場合

forEachを使う場合for文よりはシンプルに書けますね!

let total = 0;
[0, 1, 2, 3].forEach(num => total += num)

// 6
console.log(total)

reduceを使用して合計を出す方法

今度は、reduceを使って合計を出す方法です。

これまでのforやforEachを使った方法は、事前に変数を初期化しなきゃいけなかったり、値を書き換えるといった操作をしなければいけなかったのですが、こちらのreduceを使えばそれらの必要はありません!

こちらのMDNの公式サイトがreduceについて詳しく解説されているので、こちらを参考にします。

reduceの基本的なやつ

MDNのコードをTypeScript動くように少し改良したものになります。

callback内で蓄積値(accumulator)と現在値(currentValue)を足し合わせる関数を作成する事で合計処理を作成します。

JavaScript

const array1 = [1, 2, 3, 4]
const reducer = (accumulator, currentValue) => accumulator + currentValue

// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer))
// expected output: 10

// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5))
// expected output: 15

TypeScript

const array1 = [1, 2, 3, 4]
const reducer = (accumulator: number, currentValue: number) => accumulator + currentValue

// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer))
// expected output: 10

// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5))
// expected output: 15

sum、total関数

こんな感じでreduceを利用してsum関数を作成できます。

JavaScript

const sum = (numbers, initialValue = 0) => numbers.reduce(
    (accumulator, currentValue) => accumulator + currentValue,
    initialValue
)

// 6
console.log(sum([0, 1, 2, 3]))
// 10
console.log(sum([0, 1, 2, 3], 4))

TypeScript

const sum = (numbers: number[], initialValue: number = 0) => numbers.reduce(
  (accumulator: number, currentValue: number) => accumulator + currentValue,
  initialValue
)

// 6
console.log(sum([0, 1, 2, 3]))
// 10
console.log(sum([0, 1, 2, 3], 4))

まとめ

今回は、JavaScriptやTypeScriptを用いて合計を計算する方法について纏めました!

JavaScriptやTypeScriptで合計を計算するにも色々な方法があるので、便利なreduceの使い方をマスターしておきたいですね!

オススメの関連商品

Note一覧

コメント

タイトルとURLをコピーしました