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

JavaScriptで数値が有限かどうかを確認する方法とは？isFinite()メソッドの使い方を解説

JavaScriptには、指定された値が有限の数値であるかどうかを判定するためのisFinite()メソッドが用意されています。引数に渡した値が数値であれば、文字列形式（例えば"123"など）であってもtrueが返され、数値として評価できない場合はfalseが返ります。ここでは、その基本的な使い方を具体例とともに詳しく見ていきましょう。

基本構文

isFinite(value);

このメソッドは引数として1つの値を受け取ります。渡された値が有限の数値と評価できればブール値のtrueを返し、それ以外の場合はfalseを返します。

サンプルコード1：数値を渡す場合

次の例では、整数や負の小数、0、計算式の結果といったさまざまな数値をisFinite()メソッドに渡し、その判定結果を画面に出力しています。

<html>
<body>
<p id = "number"></p>
<script>
    var a = isFinite(567) + "</br>";
    var b = isFinite(-9.23) + "</br>";
    var c = isFinite(0) + "</br>";
    var d = isFinite(6-7) + "</br>";
    var bol = a + b + c + d;
    document.getElementById("number").innerHTML = bol;
</script>
</body>
</html>

実行結果

true
true
true
true

このように、567や-9.23、0、さらに計算式「6-7」の結果である-1もすべて有限の数値として扱われ、すべてtrueが返されています。

サンプルコード2：文字列や日付を渡す場合

次の例では、文字列と日付形式の文字列を引数として渡しています。数値を表す文字列（"123"など）は数値に変換して評価されるためtrueが返りますが、"string"のような文字列や"2019/08/06"のような日付形式の文字列は数値として解釈できないためfalseとなります。

<html>
<body>
<p id = "number"></p>
<script>
    var x = isFinite("123") + "<br>";
    var y = isFinite("string") + "<br>";
    var z = isFinite("2019/08/06");
    var res = x + y + z ;
    document.getElementById("number").innerHTML = res;
</script>
</body>
</html>

実行結果

true
false
false

補足：Number.isFinite()との違い

ES6（ECMAScript 2015）以降では、より厳密な判定を行うNumber.isFinite()メソッドも利用できます。グローバルなisFinite()は引数を暗黙的に数値へ変換してから判定するため、"123"のような数値文字列でもtrueを返します。一方、Number.isFinite()は型変換を行わず、引数が数値型（Number型）であり、かつ有限の値である場合のみtrueを返します。意図しない型変換を避けたい場合は、Number.isFinite()の使用を検討するとよいでしょう。


  1. JavaScriptでチェックボックスが選択されているかどうかを判定する方法

    JavaScriptでチェックボックスがチェックされているかどうかを確認するには、チェックボックス要素の checked プロパティを使用します。このプロパティは、チェックボックスが選択されている場合に true を、未選択の場合に false を返します。以下の例では、チェックボックスの状態に応じてテキストの表示・非表示を切り替える実装を紹介します。サンプルコード<!DOCTYPE html> <html> <head> <h1>Displaying textBox when a checkbox is checked</h1> C

  2. JavaScriptでボタンがクリックされたかどうかを判定する方法

    JavaScriptを使えば、ボタンがクリックされたかどうかを簡単に判定できます。最も一般的な方法は、addEventListener()メソッドでクリックイベントを監視することです。以下に、ボタンのクリックを検出し、クリックされた回数を画面に表示するサンプルコードを紹介します。 サンプルコード <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8 /> <meta name=viewport content=width=device-width, initial-scale=1