JavaScript

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

本記事では、JavaScriptで文字列を数値に変換する方法について解説します

JavaScriptの学習におすすめ参考書
改訂新版JavaScript本格入門 ~モダンスタイルによる基礎から現場での応用まで

参考書が苦手な人はUdemyの動画がおすすめ
ガチで学びたい人のためのWEB開発徹底実践(フロントエンド編)

動画情報
作成者CodeMafia
学習時間19.5時間
受講者数28,547人
レビュー (5,025件)
動画の詳細はこちら

複数のやり方で変換することができる

文字列を数値に変換するには「Number()」「parseInt()」「parseFloat()」「文字列連結」の4つの方法があります。
それぞれ、使う場面が分けられますので適切な方法を選んで変換しましょう。

Number()

文字列を数値に変換する一番オーソドックスな方法がNumberメソッドを使う方法です。

使い方はとても簡単で、Numberメソッドの引数に数値に変換したい文字列を指定します。

数値以外の文字列が含まれている状態で、Numberメソッドを使うとNaNを返します。

Number("100");  // 100 
Number("100a"); // NaN

parseInt()

parseIntメソッドは、2進数や16進数などに変換することができます。もちろん、10進数にも変換することも可能で、小数点や数字以外のものが含まれている場合は、それらが除外され数字のみ残ります。

使い方は、parseIntメソッドの第一引数に数値に変換したい文字列を指定し、第二引数に変換時の基数を指定します。
parseInt("100", 10);     // 100
parseInt("ff", 16);      // 255
parseInt("100.123", 10); // 100
parseInt("100a", 10);    // 100

parseFloat()

parseFloatメソッドは、文字列を実数に変換します。parseIntメソッドと同様に数字以外が含まれている場合は除外されますが、小数点は残ります。

使い方は、parseFloatメソッドの引数に実数にしたい文字列を指定します。
parseFloat("100");     // 100
parseFloat("100.123"); // 100
parseFloat("100a");    // 100

文字列連結

数値と空文字を引く(-)ことで、数値に変換することが出来ます。
"100" - 0; //100

文字列連結での変換はあまりお勧めできませんが、このような方法でも変換することができるという紹介です。

まとめ

今回はJavaScriptで文字列を数値に変換する方法についてご紹介しました。
最後にポイントを軽くおさらいしましょう。

ポイント

  • 単純な数値への変換はNumberメソッドを使うのがオーソドックスな方法
  • 文字列に数値以外が入っている場合は、parseIntメソッドを使う
  • 小数点も残したい場合は、parseFloatメソッドを使う

先輩くん
先輩くん
逆のパターンで数値を文字列に変換する方法も紹介しています!

ブログランキング・にほんブログ村へ PVアクセスランキング にほんブログ村