【JavaScript】文字列を数値に変換する方法

JavaScript

文字列の数字と、数値の数字

JavaScriptでは、文字列(String型)の数字と、数値型(Number)の数字があります。

const suji_string = '11'; // 文字列(String型)の数字
const suji_number = 11;   // 数値(Number型)の数字

文字列の数字を、数値の数字として扱いたい場面は多く、今回は文字列から数値への変換方法について解説していきます。

JavaScriptの「暗黙の型変換」

JavaScriptには、文字列⇄数値で自動的に変換して処理してくれる機能があります。

100 + 100 = 200          // 通常の数値の加算
'100' + '100' = '100100' // 通常の文字列の結合
'100' + 100 = '100100'   // 加算の場合、文字列が含まれる場合には暗黙の型変換され、文字列の結合となる

100 - 100 = 0            // 通常の数値の減算
'100' - '100' = 0        // 減算の場合、文字列は数値に変換され計算される 
'100' - 100 = 0          // 同上

暗黙の型変換については、意図しない変換や変換されないことによりバグや不具合につながる可能性が高いため、型変換が必要な際には明示的に変換する方が望ましいです。

Number()

Number()を使って引数に変換したい文字列を渡すことで、簡単に文字列を数値に変換することができます。

Number()では、小数値でも問題なく数値に変換してくれます。

また、数字以外の文字列を引数に渡すと、NaNが返されます。

Number('123456');  // 123456
Number('123.456'); // 123.456
Number('abcdef');  // NaN
Number('123abc');  // 

parseInt()

parseInt()を使うことで、文字列を整数値に変換することができます。

parseInt()では、第二引数に変換時の基数を渡すことができます。(デフォルトでは10)

また、文字列の変換時は左側から評価されます。最初の文字が正しく評価できない場合にはNaNを返し、2番目以降の文字が正しく評価できない場合にはそれ以降を無視します。

parseInt('123456');  // 123456
parseInt('123.456'); // 123
parseInt('ff', 16);  // 256
parseInt('1a1a1a');  // 1
parseInt('a1a1a1');  // NaN

parseFloat()

parseFloat()を使うことで、数値を文字列に変換する際に、小数点以下も扱うことができるようになります。

parseInt()では、第二引数に変換時の基数を指定することができましたが、parseFloat()では指定できません。

parseFloat('123456');  // 123456
parseFloat('123.456'); // 123.456
parseFloat('ff', 16);  // NaN
parseFloat('1a1a1a');  // 1
parseFloat('a1a1a1');  // NaN

コメント

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