忘れる前に覚書。優しい文章を目指します。
ザ・覚書 ザ・覚書
出来るだけ子供にも、わかりやすいように書いて行きたいと思います。

PCバージョンでサイトを表示しています。
【ザ・覚書 3クリックアンケート実施中】
暑さの一番の原因はなんだと思いますか?
あなたの支持する政党はどの党ですか?
ザ・覚書のトップページに戻る今のページの関連ページのリストへ

JavaScript 計算してみる(parseInt)

☆JavaScript 計算してみる(parseInt)

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

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

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

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

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


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



・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 ]
に割り降られるようです。

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

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

// AとBを足す関数
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;
で、文字である数値を数値型(?)に変換したのちに、足しています。
単純に足すと、「1」+「2」の場合、「12」になっちゃいます。

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

例えば、
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で変換したもの

として、
(16進数入力をエラーにする為にも、parseIntの第2引数で10進数も付け加えておきました。)

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

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

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


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


記述:2014年03月頃





Twitter Facebook Google+ はてな Pocket LINE




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

お名前

コメント




【ザ・覚書 3クリックアンケート実施中】
暑さの一番の原因はなんだと思いますか?
あなたの支持する政党はどの党ですか?

今のページの関連ページのリストへ
ザ・覚書のトップページに戻る
全ページのリストへ