JavaScriptで配列内の重複しない要素の合計を求める方法

問題の概要

まず、次のような数値の配列を想定してみましょう。

const arr = [1, 5, 2, 1, 2, 3, 4, 5, 7, 8, 7, 1];

この配列を受け取り、重複を除外した個別の要素（ユニークな値）の合計を計算するJavaScript関数を作成します。

上記の配列の場合、重複を除いた要素は「1, 5, 2, 3, 4, 7, 8」となるため、出力は次のようになります。

30

実装コード

この問題を解くコードは以下のとおりです。

const arr = [1, 5, 2, 1, 2, 3, 4, 5, 7, 8, 7, 1];
const distinctSum = arr => {
    let res = 0;
    for(let i = 0; i < arr.length; i++){
        if(i === arr.lastIndexOf(arr[i])){
            res += arr[i];
        };
        continue;
    };
    return res;
};
console.log(distinctSum(arr));

コードの解説

この関数の仕組みは以下のとおりです。

• 配列の各要素について、lastIndexOf()で得られる「その値が最後に出現するインデックス」と現在のインデックスを比較します。
• 両者が一致した場合にのみ値を合計へ加算するため、各ユニークな値は必ず1回だけカウントされます。
• すべての要素を走査し終えた時点で、合計値を返します。

実行結果

コンソールには次の出力が表示されます。

30

別のアプローチ：Setを使った簡潔な書き方

Setオブジェクトを利用すると、重複の除去をより簡単に行えます。

const distinctSum = arr => {
    const unique = [...new Set(arr)];
    return unique.reduce((sum, num) => sum + num, 0);
};
console.log(distinctSum(arr)); // 30

Setは重複する値を自動的に排除するため、スプレッド構文で配列に戻し、reduce()で合計を求めるだけで実装できます。コードの意図が明確になり、可読性も向上します。