JavaScriptで文字列を連結せずに数値計算を実行する方法【単項プラス演算子】

たとえば、数値を表す文字列からなる次のような配列があるとします。

const arr = ['3', '3', '55', '23', '67', '43', '12', '67', '87', '12'];

このような配列を受け取り、各要素を文字列として連結するのではなく、すべての要素を数値として合計した値を返すJavaScript関数を作成する必要があります。

解決策：単項プラス（+）演算子を使う

この問題は、単項プラス演算子（+）を使うことでシンプルに解決できます。実際に関数のコードを書いてみましょう。

コード例

const arr = ['3', '3', '55', '23', '67', '43', '12', '67', '87', '12'];
const sumString = arr => {
    const num = arr.reduce((acc, val) => {
        const sum = acc + (+val || 0);
        return sum;
    }, 0);
    return num;
};
console.log(sumString(arr));

単項プラス演算子の仕組み

文字列の前に置かれた単項プラス（+）演算子は、String型からNumber型への明示的な型変換（型強制）を強制します。文字列が有効な数値として解釈できる場合は対応する数値が返されますが、先頭の文字が有効な数値でない場合にはNaNが返されます。

さらに、(+val || 0)という記述により、変換結果がNaNのとき（falsyな値のとき）は0が代わりに使われます。そのため、数値に変換できない要素が配列に混在していてもエラーになることなく、安全に合計を求められるのがポイントです。

出力結果

コンソールには次のように出力されます。

372