JavaScript で文字列が数字かどうかをチェックする

Hiten Kanwar 2023年10月12日
  1. JavaScriptで与えられた文字列が数値かどうかをチェックするには、isNaN()関数を使用する
  2. JavaScriptで与えられた文字列が数値かどうかをチェックするには、+演算子を使用する
  3. JavaScriptで与えられた文字列が数値かどうかをチェックするには、parseInt()関数を使用する
  4. JavaScriptで与えられた文字列が数値かどうかをチェックするには、Number()関数を使用する
  5. JavaScriptで与えられた文字列が数値かどうかをチェックするには正規表現を使用する
JavaScript で文字列が数字かどうかをチェックする

プログラミング言語において、数値は整数、浮動小数点数などを示すデータ型です。文字列は数値のみならず、すべての文字を表します。文字列には数値も含めることができます。

この記事では、与えられた文字列が数値であるかどうかを確認します。

JavaScriptで与えられた文字列が数値かどうかをチェックするには、isNaN()関数を使用する

isNaN()関数は、Not-a-Numberの略であり、実際の数値および数値の形式の文字列を含む、与えられた値が数値でないかどうかを判断するために使用される組み込みのJavaScript関数です。

isNaN()関数は、与えられた値が数値でない場合にtrueを返し、数値または有効な数値に変換できる場合にfalseを返します。

以下は、isNaN()関数の基本的な構文です:

isNaN(value)
  • value:数値であるかどうかをチェックしたい値。変数、定数、または式を使用できます。

例:

console.log(isNaN('195'))
console.log(isNaN('boo'))
console.log(isNaN('100px'))

出力:

false 
true
true

有効な値に対してtrueを返す関数を作成したい場合、isNaN()関数の出力を否定する関数を作成することができます。

function isNum(val) {
  return !isNaN(val)
}
console.log(isNum('aaa'));
console.log(isNum('13579'));
console.log(isNum('-13'));

出力:

false
true
true

このように、isNum()という名前の関数は、有効な数値に対してtrueを返します。

小数点を含む数値の文字列の処理

isNaN()関数は柔軟であり、小数点を含む数値の文字列も処理することができます。例えば:

const str = '3.14';  // The string we want to check
const isNumeric = isNaN(str);

if (isNumeric) {
  console.log(`${str} is NOT a number.`);
} else {
  console.log(`${str} is a number.`);
}

出力では、‘3.14’が数値であると正しく認識されます:

3.14 is a number.

JavaScriptで与えられた文字列が数値かどうかをチェックするには、+演算子を使用する

JavaScriptの+演算子は2つの目的で使用されます:算術加算に使用することと、単項演算子としての型変換に使用することです。

文字列に適用すると、+演算子はそれらを数値に変換しようと試みます。文字列が数値に正常に変換できる場合、結果は有効な数値となります。そうでない場合、NaN(Not-a-Number)になります。

例えば、

console.log(+'195')
console.log(+'boo')

出力:

195
NaN

JavaScriptで与えられた文字列が数値かどうかをチェックするには、parseInt()関数を使用する

JavaScriptのparseInt()メソッドは、文字列を解析して整数(整数)に変換するために使用されます。文字列は左から右に読み込まれ、整数の有効な部分ではない文字が出現するまで解析が停止します。

parseInt()を使用する基本的な構文は次のとおりです:

parseInt(string[, radix]);
  • string:整数にパースして変換する文字列。
  • radix(オプション):文字列で使用される数字システムの基数を表す2から36の整数。このパラメータはオプションで、省略した場合、JavaScriptは基数10(10進数)を想定します。

文字列から数値を抽出できない場合、NaNを返します。

例えば、

console.log(parseInt('195'))
console.log(parseInt('boo'))

出力:

195
NaN

基数を指定した数値の文字列の処理

parseInt()メソッドでは、文字列で使用される数字システムの基数(基数)を指定することもできます。例えば、2進数(基数2)、8進数(基数8)、16進数(基数16)の数字を解析できます。

以下は、16進数の文字列を解析する例です:

const hexString = '1A';                    // Hexadecimal string
const intValue = parseInt(hexString, 16);  // Specify base 16

if (isNaN(intValue)) {
  console.log(`${hexString} is NOT a number.`);
} else {
  console.log(`${hexString} is a number.`);
}

この場合、出力では、'1A'が16進数であると正しく認識されます:

1A is a number.

JavaScriptで与えられた文字列が数値かどうかをチェックするには、Number()関数を使用する

Number()関数は、引数をオブジェクトの値を表す数値に変換します。値を数値に変換できない場合、NaNを返します。

それを文字列と一緒に使用して、与えられた文字列が数値であるかどうかをチェックすることができます。

例えば、

console.log(Number('195'))
console.log(Number('boo'))

出力:

195
NaN

JavaScriptで与えられた文字列が数値かどうかをチェックするには正規表現を使用する

正規表現(正規表現とも呼ばれる)は、文字列の集合を特定するパターンです。文字列内でのパターンマッチングに使用されるため、文字列の検証などのタスクに対して汎用的なツールとなります。

JavaScriptでは、RegExpコンストラクタを使用するか、スラッシュ(/)で囲まれた正規表現リテラル表記を使用して正規表現を作成できます。

このようなパターンを使用して、文字列が数字を含んでいるかどうかを確認することができます。

まず、数値の値に一致する正規表現パターンを定義する必要があります。正おと負の整数、および浮動小数点数に一致するシンプルなパターンを作成できます。

const numberPattern = /^[-+]?[0-9]*\.?[0-9]+([eE][-+]?[0-9]+)?$/;

このパターンの動作は次のとおりです:

  • ^:文字列の先頭をアサートします。
  • [-+]?:オプションの正または負の符号に一致します。
  • [0-9]*:小数点の前に0個以上の数字に一致します。
  • \.?:オプションの小数点に一致します。
  • [0-9]+:小数点の後に1個以上の数字に一致します。
  • ([eE][-+]?[0-9]+)?e-3E+4のようなオプションの指数部分に一致します。

次に、文字列に正規表現パターンのtest()メソッドを適用します。test()メソッドは、文字列がパターンに一致する場合はtrueを返し、それ以外の場合はfalseを返します。

const isNumber = numberPattern.test(str);

例:

function isNumeric(val) {
  return /^-?\d+$/.test(val);
}

console.log(isNumeric('aaa'));
console.log(isNumeric('13579'));
console.log(isNumeric('-13'));

出力:

false
true
true

関連記事 - JavaScript String