JavaScriptで文字列内のすべての数字を抽出して合計する方法

問題の概要

JavaScriptで、英字や記号などが混在する文字列を受け取り、その中に含まれる1桁の数字をすべて合計して返す関数を作成することを考えます。

たとえば「uyyudfgdfgf5jgdfj3hbj4...」のような文字列が与えられた場合、関数は文字列中に出現する数字(5, 3, 4...)だけを拾い出し、それらの総和を計算して返す必要があります。

実装例

const str = 'uyyudfgdfgf5jgdfj3hbj4hbj3jbb4bbjj3jb5bjjb5bj3';
const sumNum = str => {
    const strArr = str.split("");
    let res = 0;
    for(let i = 0; i < strArr.length; i++){
      if(+strArr[i]){
        res += +strArr[i];
      };
    };
    return res;
};
console.log(sumNum(str));

出力結果

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

35

コードの解説

このコードの処理の流れは次のとおりです。

1. 文字列を1文字ずつに分解する: split("") を使うことで、文字列を空文字列で区切り、1文字ずつの要素を持つ配列に変換できます。

2. 数値への変換と判定: 単項プラス演算子(+)を各文字に適用すると、数字の文字は対応する数値に変換され、数字以外の文字は NaN(Not a Number)になります。if文の条件式では NaN や 0 は偽(false)と評価されるため、数字以外の文字は自動的に除外されます。

補足: 数字の「0」も偽と評価されてスキップされますが、合計に0を加えても結果は変わらないため、この実装でも正しく動作します。

正規表現を使ったより簡潔な方法

match() メソッドと reduce() を組み合わせると、同じ処理をさらに短く書くことができます。

const sumNum = str => {
    const nums = str.match(/\d/g) || [];
    return nums.reduce((sum, n) => sum + +n, 0);
};

/\d/g は「1桁の数字」にマッチする正規表現です。match() により数字のみを配列として取り出し、reduce() でその合計を一気に計算しています。ループ処理を自分で書く必要がないため、可読性が高くおすすめの書き方です。