JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptのparseFloat()関数とは？構文と使い方をわかりやすく解説

JavaScriptのparseFloat()関数は、引数に渡された文字列を解析し、浮動小数点数として返すグローバル関数です。文字列の先頭から数値として解釈できる部分を読み取り、数値として扱えない文字に到達した時点で解析を終了します。

先頭にある空白文字は無視されます。また、引数がすでに数値である場合は、その値がそのまま返されます。一方、文字列の先頭が数値として解釈できない場合には、NaN（Not a Number）が返される点に注意してください。

構文

parseFloat()関数の構文は以下のとおりです。

parseFloat(string);

使用例

次の例では、parseFloat()関数を使って、数値や数値を含む文字列を浮動小数点数に変換しています。

<html>
<head>
  <title>JavaScript Example</title>
</head>
<body>
  <script type="text/javascript">
    var result1 = parseFloat(Math.PI);
    document.write("Result: "+result1);
    document.write('<br>');
    var result2 = parseFloat("245.12@welcome");
    document.write("Result: "+result2);
    document.write('<br>');
    var result3 = parseFloat("11111100.010");
    document.write("Result: "+result3);
  </script>
</body>
</html>

実行結果

Result: 3.141592653589793
Result: 245.12
Result: 11111100.01

結果の解説

  • parseFloat(Math.PI)：円周率（3.141592653589793）はすでに数値であるため、そのままの値が返されます。
  • parseFloat("245.12@welcome")：「@」は数値として解釈できない文字のため、その直前までの「245.12」だけが返されます。
  • parseFloat("11111100.010")：小数点以下の末尾の「0」は数値の値に影響しないため、「11111100.01」として返されます。

このように、parseFloat()関数は、文字列から数値部分を抽出して浮動小数点数に変換したい場合に非常に便利です。なお、小数を切り捨てて整数だけを取得したい場合は、parseInt()関数を使用してください。用途に応じて両者を使い分けることで、文字列と数値の変換を柔軟に扱えます。

  1. JavaScriptでのメソッド借用：call()・apply()・bind()の使い方を解説

    JavaScriptでは、call()、apply()、bind()という3つのメソッドを使うことで、あるオブジェクトが持つメソッドを別のオブジェクトが「借用」できます。これは、本来そのメソッドを持たないオブジェクトに対して、thisの参照先を差し替えてメソッドを実行できる便利なテクニックです。 3つのメソッドの違い call()：引数をカンマ区切りで個別に渡し、即座に関数を実行します。 apply()：引数を配列（または配列風オブジェクト）として渡し、即座に関数を実行します。 bind()：thisを固定した新しい関数を返すだけで、即座には実行されません。返された関数は後から好きなタイミン

  2. JavaScriptで関数の実行結果をHTMLとして表示する方法

    関数の結果をHTMLとして表示するには？JavaScriptで関数の実行結果をHTMLとして画面に表示したい場合は、document.getElementById().innerHTML を使います。このプロパティに文字列や計算結果を代入することで、指定した要素の中身を動的に書き換えることができます。innerHTMLはDOM操作の基本であり、ユーザーの操作に応じてリアルタイムに画面を更新したい場合によく利用されます。サンプルコード以下は、ページ内にあるテキストボックス（input type=text）の数をカウントし、その結果をHTMLとして表示するコード例です。<!DOCTYPE h