本記事では、JavaScriptで文字列を数値に変換する方法について解説します。
- 誰でも分かるように嚙み砕いて説明してくれる
- アニメーションの知識が深く学べる
- 1つのWebサイトを作りながら学べる
ポチップ
先輩くんAmazon Kindle Unlimitedに登録すると、月額980円で読み放題だからオススメだよ！
後輩ちゃん初回30日間は無料だから、まだ登録したことのない人はぜひ試してみてね！
変数名/関数名にもう悩まない！
- 美しいコードが書けるが自然と書けるようになる
- 他の開発者が理解しやすいコードになる
ポチップ
複数のやり方で変換することができる
文字列を数値に変換するには「Number()」「parseInt()」「parseFloat()」「文字列連結」の4つの方法があります。
それぞれ、使う場面が分けられますので適切な方法を選んで変換しましょう。
Number()
文字列を数値に変換する一番オーソドックスな方法がNumberメソッドを使う方法です。
使い方はとても簡単で、Numberメソッドの引数に数値に変換したい文字列を指定します。
数値以外の文字列が含まれている状態で、Numberメソッドを使うとNaNを返します。
Number("100"); // 100
Number("100a"); // NaNparseInt()
parseIntメソッドは、2進数や16進数などに変換することができます。もちろん、10進数にも変換することも可能で、小数点や数字以外のものが含まれている場合は、それらが除外され数字のみ残ります。
使い方は、parseIntメソッドの第一引数に数値に変換したい文字列を指定し、第二引数に変換時の基数を指定します。
parseInt("100", 10); // 100
parseInt("ff", 16); // 255
parseInt("100.123", 10); // 100
parseInt("100a", 10); // 100parseFloat()
parseFloatメソッドは、文字列を実数に変換します。parseIntメソッドと同様に数字以外が含まれている場合は除外されますが、小数点は残ります。
使い方は、parseFloatメソッドの引数に実数にしたい文字列を指定します。
parseFloat("100"); // 100
parseFloat("100.123"); // 100
parseFloat("100a"); // 100文字列連結
数値と空文字を引く(-)ことで、数値に変換することが出来ます。
"100" - 0; //100文字列連結での変換はあまりお勧めできませんが、このような方法でも変換することができるという紹介です。
まとめ
今回はJavaScriptで文字列を数値に変換する方法についてご紹介しました。最後にポイントを軽くおさらいしましょう。
- 単純な数値への変換はNumberメソッドを使うのがオーソドックスな方法
- 文字列に数値以外が入っている場合は、parseIntメソッドを使う
- 小数点も残したい場合は、parseFloatメソッドを使う
先輩くん逆のパターンで数値を文字列に変換する方法も紹介しています！
