JavaScriptのNumberオブジェクト parseFloat() メソッドの使い方

プログラミング

JavaScriptのNumberオブジェクト parseFloat() メソッドの使い方メソッドについて記載します。

概要、実際のサンプルコードを交えて構文などの使い方をまとめてみました。

JavaScriptのNumberオブジェクトとは?

JavaScriptのNumber オブジェクトは、整数または浮動小数点数といった数値の日付を表します。
ブラウザでは、数値リテラルを自動的に数値クラスのインスタンスに変換するので、Numberオブジェクトについて心配する必要はありません。

それでは、次に本題の説明に移ります。

JavaScriptのNumberオブジェクト parseFloat() メソッドの使い方概要

parseFloat() メソッドは、文字列を浮動小数点数に変換します。

文字列の先頭が数字でない場合は、NaN(Not a Number)を返します。

構文、使い方

構文:
parseFloat(string)

使い方:
文字列を浮動小数点数に変換します。

文字列の先頭が数値に該当する場合は、その数値を返します。

そうでない場合は、NaNを返します。

引数について

引数として文字列を渡し、その文字列を浮動小数点数に変換して返す。

返り値について

parseFloat() メソッドは、文字列をパースして浮動小数点数を返します。

このメソッドを利用した便利なテクニック

parseFloat() メソッドを使うと、文字列を数値に変換することができます。

例えば、文字列の「1.5」を数値の1.5に変換することができます。

このテクニックは、フォーム入力などで数値を取得する際に便利です。

現場で実際にどのように使われているか

parseFloat() メソッドは、文字列を数値に変換するために使用されます。

例えば、文字列 “”3.14″” を数値 3.14 に変換する場合、次のようにします。

JavaScriptのNumberオブジェクト parseFloat() メソッドの使い方と一緒によく使われる処理

parseFloat() メソッドを使用して、文字列を数値に変換する処理がよく使われます。

なぜなら、JavaScriptでは文字列と数値を混在させることができるため、文字列を数値に変換する必要があるからです。

使用する上での注意点

– 文字列の先頭が数値でない場合は、NaNを返します。
– 文字列が空である場合は、NaNを返します。
– 文字列が数値を表す文字列以外の文字を含む場合は、NaNを返します。

JavaScriptのNumberオブジェクト parseFloat() メソッドの使い方と似た処理のJSメソッド、違い

parseInt() と似ていますが、下記の違いがあります。

  • parseInt() メソッド: 文字列を整数に変換する。
  • parseFloat() メソッド: 文字列を浮動小数点数に変換する。

JavaScriptのNumberオブジェクト parseFloat() メソッドの使い方を使ったサンプルコードの紹介

parseFloat()メソッドを使ったサンプルコード1

 

123.45

parseFloat()メソッドを使ったサンプルコード2

 

123.45

parseFloat()メソッドを使ったサンプルコード3

 

NaN

JavaScript Numberオブジェクトの他メソッドについて

JavaScriptのNumberオブジェクトの他メソッドについては、下記記事にもまとめていますので参考にしてみてください

メソッド名 機能 リンク
isFinite() 値が有限数かどうかを確認します JavaScriptのNumberオブジェクト isfiniteメソッドの使い方
isInteger() 値が整数であるかどうかを確認します JavaScriptのisIntegerオブジェクト isIntegerメソッドの使い方
isNaN() 値がnumber.nanであるかどうかを確認します JavaScriptのNumberオブジェクト isNaNメソッドの使い方
isSafeInteger() 値が安全な整数であるかどうかを確認します JavaScriptのNumberオブジェクト isSafeIntegerメソッドの使い方
parseFloat() 文字列を解析しますanは番号を返します JavaScriptのNumberオブジェクト parseFloatメソッドの使い方
parseInt() 文字列を解析すると、整数が返されます JavaScriptのNumberオブジェクト parseIntメソッドの使い方
toExponential(x) 数値を指数表記に変換します JavaScriptのNumberオブジェクト toExponentialメソッドの使い方
toFixed(x) 小数点以降にx数の数字で数字をフォーマットします JavaScriptのNumberオブジェクト toFixedメソッドの使い方
toLocaleString() ロケール設定に基づいて、数値を文字列に変換します JavaScriptのNumberオブジェクト toLocaleStringメソッドの使い方
toPrecision(x) 数字をxの長さをフォーマットします JavaScriptのNumberオブジェクト toPrecisionメソッドの使い方
toString() 数字を文字列に変換します JavaScriptのNumberオブジェクト toStringメソッドの使い方
valueOf() 数のプリミティブ値を返します JavaScriptのNumberオブジェクト valueofメソッドの使い方

また、JavaScriptの公式ドキュメントであるMDNで記載されているNumberオブジェクトのparseFloatメソッドについても補足としてリンクを貼っておきます。参考にしてみてください。

Number.parseFloat() - JavaScript | MDN
Number.parseFloat() は静的メソッドで、引数を解釈して浮動小数点値を返します。引数の数値が解釈できない場合は、 NaN を返します。
タイトルとURLをコピーしました