Index

HOME > プログラムTOP > JavaScript



数字の確認と変換

 JavaScript の実用的なTips集です。ここでは、数字に関する基本的な処理方法を扱います。また、Number オブジェクトの内容も含みます。Numberオブジェクトは、プログラムで使う数値の基本情報を扱うオブジェクトです。
[INDEX] 数値の確認: 数値かどうか・演算可能かどうかのチェック
最大値と最小値: 使用可能な最大数値と最小数値を調べる
文字列との変換: 数字から文字列への変換・文字列から数字への変換
カンマを入れる: 三桁ごとにカンマを入れるサンプル

sasaraan programming

Exposition

■数値の確認

 数字であるかどうかを確認するには、グローバルメソッドの isNaN を使います。数字か、または文字列であっても数字として扱うことができれば false、それ以外は true を返します。NaN は Not a Number (数字ではない、の意味)の略です。
 また、演算可能かどうかは、isFinite メソッドを利用します。isFinite メソッドは式も評価することができます。(下例参照)
isNaN(value) value が数値なら false、数値以外なら true
isFinite(value) value が演算可能なら true、不可能なら false
// JavaScriptソース 
// 数字と式のチェック
function chkValue() {
    var n = document.Form1.Text1.value;
    var s = "isNaN : " + isNaN(n) + "\n";
    s += "isFinite : " + isFinite(n*2) + "\n";
    alert(s);
} 
<!-- HTMLソース -->
<form name="Form1" action="" style="margin:1ex">
    <input type="text" name="Text1" size="16" value="123">
    <input type="button" value="チェック"  onclick="chkValue()"gt; 
</form>    

■最大値と最小値

 現在の環境における最大値は、Number オブジェクトのプロパティ、MAX_VALUE、最小値は MIN_VALUE によって取得することができます。これらの値は、使用しているコンピュータやソフトウェアによって異なります。
Number.MAX_VALUE 最大値 
Number.MIN_VALUE 最小値 
 また、これらの範囲を超えているかどうかは、Number オブジェクトのプロパティ、NEGATIVE_INFINIY(負の無限大)、及び POSITIVE_INFINITY(正の無限大) によってチェックすることができます。
Number.POSITIVE_INFINITY 正の無限大(最大値を超過)
Number.NEGATIVE_INFINITY 負の無限大(最小値を超過)

■文字列との変換

 数値は "123" のように、文字列形式でも表現できますが、数値として演算を行う場合には数値形式に変換する必要があります。以下のように文字列として定義された数値は、あくまでも文字列として処理されます。
var strA = 100;
document.write(strA + 200);    // = 300 : 通常の演算処理
var strB = "100";
document.write(strB + 200);    // = "100200" : 文字列として連結される
 文字列を数値を変換する時、浮動小数点と整数とを分けて変換させることができます。それぞれ、グローバルメソッドの parseFloat、parseInt を使用します。ただし、parseInt では、小数部分は無視されます。
parseFloat(str) str を浮動小数点型の数値に変換(str : 文字列)
parseInt(str) str を整数型の数値に変換(str : 文字列)
// JavaScriptソース
// 文字列を数字に変換
function CNum() {
    var n = document.Form3.Text3.value;
    var s = "";
    if (isNaN(n)) {
        s += "数字ではありません。\n"
    } else {
        s += "parseFloat : " + parseFloat(n) + "\n";
        s += "parseInt : " + parseInt(n) + "\n";
    }
    alert(s);
}    
<!-- HTMLソース -->
<form name="Form3" action="" style="margin:1ex">
    <input type="text" name="Text3" size="16" value="123.5"> 
    <input type="button" value="チェック"  onclick="CNum()"> 
</form>    
 逆に、数値を文字列として扱う場合は、グローバル・メソッドの toStringメソッドを利用します。
obj.toString() obj を文字列に変換(obj : オブジェクト)
var strC = 100;
document.write(strC + 200 + "<br>");     // = 300
document.write(strC.toString() + 200);    // = "100200"

■カンマを入れる

 三桁ごとにカンマを入れるサンプルを掲載しておきます。負の数でも小数があっても動作しますが、全角数字には対応していませんのでご注意ください。なお、ここでは、整数部と小数部を分けるのに、 Stringオブジェクトの splitメソッドを使用しています。これは指定文字で文字列を分割し、配列として返すものです。また、charAtメソッドで、指定した位置( = 文字インデックス / 1文字目 = 0)の文字を取り出しています。
 ちなみに、JavaScript は小数の計算でわずかな誤差を生じることがあり、四則演算でこれを求める( 小数部 = N - parseInt(N) など) のはおすすめできません。
// JavaScriptソース
// 数値をカンマつき文字列に変換
function FormatNumber(num) {
    if (isNaN(num)) return ""; 	        // 数値でない時は処理終了
    var src = (num.toString()).split(".");      // 変換前(整数部(src[0])と小数部(src[1])に分割)
    var buf = "";                // 変換後の文字列
    var i, j;                      // i は文字数のカウント用、j は3桁認識用
    for (i=src[0].length-1, j=0; i>=0; i--) {
        // 右端から1文字づつbufにコピーしながら3桁ごとにカンマを付加(*下記注)
        buf = src[0].charAt(i) + buf;
        if (++j == 3 && i > 0 && !isNaN(src[0].charAt(i-1))) {
            buf = "," + buf;
            j = 0;
        }
    }
    if (src[1]) buf += "." + src[1];        // 小数部がある時は追加
    return buf;
}

var N = 3600000;
document.write(FormatNumber(N), "<br>");    // = "3,600,000"
N = 509.2659;
document.write(FormatNumber(N), "<br>");    // = "509.2659"
N = 1956.88;
document.write(FormatNumber(N), "<br>");    // = "1,956.88"
N = -255.7612;
document.write(FormatNumber(N), "<br>");    // = "-255.7612"
*注 : i > 0 は先頭にカンマが付くのを防ぐため。 !isNaN(src[0].charAt(i-1)) は、記号(-)の後にカンマが付くのを防ぐため。

www.sasaraan.net

(c) morijoh