JavaScript　計算してみる（parseInt）

☆JavaScript　計算してみる（parseInt）

JavaScriptは、したことがなかったので、遊びながら試したりした覚書です。
ちょっとこのサイトの覚書で、今後、内容によっては簡単な計算が出来るコーナーもあったらいいかもといった感じで勉強です。

文法とかは、Ｃ言語と同じ感じなので気軽に遊べそうです。

まず、基礎なんで計算でも。

JavaScriptは、JavaScriptに対応していないブラウザでは表示されないと思うので、
下が見えない方もいるかとは思います。

とりあえず、足し算。作ってみました。
箱の１個目と２個目に数値を入れて「＝ボタン」を押してみてください。

＋

コードの説明を書いておきます。
折角なので、関数に引数を与えてみて書いてみました。

---

・HTML部分
<FORM name="form1">
  <INPUT size="25" type="text" name="A">
  ＋
  <INPUT size="25" type="text" name="B">
  <INPUT type="button" value="=" onclick="Add(this.form)">
  <INPUT size="25" type="text" name="X">
</FORM>


ボタンのonclicに書いたのが、JavaScriptでの関数になります。
ボタンを押すと、この関数（function Add( obj )）が動作します。
引数は、FORM自身。

渡した場合、FORMの各要素は、
上から、数値が割り振られるようで、
nameのAというのが、JavaScriptでのobj.elements[ 0 ]
nameのBというのが、JavaScriptでのobj.elements[ 1 ]
ボタンが、JavaScriptでのobj.elements[ 2 ]
nameのXというのが、JavaScriptでのobj.elements[ 3 ]
に割り降られるようです。

スクリプト部分がＣ言語の宣言や実態と同じ感じなので、
このＨＴＭＬ部分は、スクリプトの下に書いておきます。

・スクリプト部分
<SCRIPT language="JavaScript">

// ＡとＢを足す関数
function Add( obj )
{
    var num0,num1;

    num0 = obj.elements[ 0 ].value;
    num1 = obj.elements[ 1 ].value;
    numpi0 = parseInt( obj.elements[ 0 ].value, 10 ); // 整数値に変換
    numpi1 = parseInt( obj.elements[ 1 ].value, 10 ); // 整数値に変換

    // どっちも整数値かな？ 文字とか入ってないかな？
    if ( num0 == numpi0 && num1 == numpi1 ) //文字列を整数に変換したものを、元の値と比較
    {
        // 同じなら
        obj.elements[ 3 ].value = numpi0 + numpi1;
    }
    else
    {
        // 整数値でない
        obj.elements[ 3 ].value = "整数値をいれてね";
    }
}
</SCRIPT>

初歩なんで単純に計算しても良かったのですが、一応、エラー処理をいれておきました。
入力は、半角しか対応していないのですが・・・。
半角で入力してね！

計算の部分は、
obj.elements[ 3 ].value = numpi0 + numpi1;
で、文字である数値を数値型（？）に変換したのちに、足しています。
単純に足すと、「１」＋「２」の場合、「１２」になっちゃいます。

エラー処理の部分は、
文字とか、１６進数とか入っていると、駄目ってエラー処理です。
ちょっと、１６進数とかを入れたりした場合など、エラーになってくれなくて、色々考えました。

例えば、
parseInt( obj.elements[ 0 ].value )
とすると、その値は、
0.1の場合 = 0
0x12の場合 = 18
12abの場合 = 12
aaの場合 = NoN

と結構この関数は、勝手に判断して、文字が入っていても、ぽい数字とかにしてしまうようですので、

    num0 = obj.elements[ 0 ].value;
    num1 = obj.elements[ 1 ].value;
    numpi0 = parseInt( obj.elements[0].value, 10 ); // 整数値に変換
    numpi1 = parseInt( obj.elements[1].value, 10 ); // 整数値に変換

num0と1は、入力されたそのままの文字列
numpi0と1は、入力された文字列を数字変換関数であるparseIntで変換したもの

として、
（１６進数入力をエラーにする為にも、parseIntの第２引数で１０進数も付け加えておきました。）

if ( num0 == numpi0 && num1 == numpi1 )
で比較しておきました。

こうしておけば、入力されたものと、parseIntの結果が違えば、
整数値を入力してねと、判断できました。

ちなみに、Ｃ言語だとそのまま出来ませんが、
文字と数値を＝で比較する場合、文字の方は、いったん数値に代えるらしいので、
＝＝が出来るようです。


しょーもないプログラムですが、第１歩です。


記述：2014年03月頃

Twitter Facebook Google+ はてな Pocket LINE

一言掲示板です。なにかありましたら以下に書いて書き込みボタンを押して下さい。
管理人による書き込みの確認後、荒らし書き込みでない場合に表示させていただきます。
悪意ある書き込みや挑発的な書き込みと思われる内容は、表示させません。
その為、ちょっと書き込みから表示までに時間がかかってしまいます。ご了承下さい。

お名前

コメント

色 色 色 色 色 色 色 色

---