switchを使って四則演算のプログラムを作りました。

締切済

質問者：makiko3300
質問日時：2010/06/07 16:18
回答数：3件

switchを使って四則演算のプログラムを作りました。
以下プログラム
<html>
<head>
<title>kadai05</title>
<script type=text/javascript>
function Calc(n) {
a = parseInt(document.f.a.value);
b = parseInt(document.f.b.value);
switch (n) {
case 1 : Ans = a + b; break;
case 2 : Ans = a - b; break;
case 3 : Ans = a * b; break;
case 4 : Ans = a / b; break;
}
document.f.c.value = Ans;
}
</script>
</head>
<body>
<center>
<h3>四則演算</h3>
<form name = "f">
<input name="a" size="8"> ☆ <input name="b" size="8"> = <input type="text" name="c" size="10">
<p>
<input type="button" value="＋" onclick="Calc(1)">　<input type="button" value="－ "onclick="Calc(2)">
<input type="button" value="×" onclick="Calc(3)">　<input type="button" value="÷ "onclick="Calc(4)">
</form>
</center>
</body>
</html>

これは問題集の問題なのですが、答えを見ると
b = parseInt(document.f.b.value)とswitch (n) {
の間に
Ans = 0;が入っています。
これはなぜ入れているのか解説がありません。
特になくても困らないと思うのですが、なぜ入れているのでしょうか？
入れないことでどんな不具合が起きる可能性があるのでしょうか？
教えて下さい。
お願い致します。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

最新から表示
回答順に表示

No.3

回答者： think49
回答日時：2010/06/07 22:03

#2です。

> TypeError: Cannot read property 'a' of undefined
読み直してみて「何かおかしい」と思ったら、<form> が書かれていないためのエラーでした…。ごめんなさい。

以下のように <form> を入れた場合、

-----
<form name = "f">
<input name="a" size="8"> ☆ <input name="b" size="8"> = <input type="text" name="c" size="10">
<p>
<input type="button" value="＋" onclick="Calc(1)">　<input type="button" value="－ "onclick="Calc(2)">
<input type="button" value="×" onclick="Calc(3)">　<input type="button" value="÷ "onclick="Calc(4)">
</form>
<script type="text/javascript"></script>
-----

「Uncaught ReferenceError: Ans is not defined」のエラーが返ってきます。(GoogleChrome4.1で確認)
エラーが返ってくる理由は #2 で述べた理由と同じなので、割愛します。

- 0
- 件

通報する

No.2

回答者： think49
回答日時：2010/06/07 21:54

> 入れないことでどんな不具合が起きる可能性があるのでしょうか？

不具合が起きる可能性が一つあります。

----
function Calc(n) {
a = parseInt(document.f.a.value);
b = parseInt(document.f.b.value);
switch (n) {
case 1 : Ans = a + b; break;
case 2 : Ans = a - b; break;
case 3 : Ans = a * b; break;
case 4 : Ans = a / b; break;
}
document.f.c.value = Ans;
}
Calc(5);
----

このコードを実行すると、

TypeError: Cannot read property 'a' of undefined

のエラーが返ってきます。
Switch文は nの値が 1,2,3,4 のいずれの値である場合にだけ動作するので、変数Ansが初期化されていないのです。
先に、Ans = 0; のように初期化しておけばこの問題は防げます。
「引数にどんな値が来るのか？」「意図しない値が来たときにはどういう挙動にするのか？」
そういった事を考えておくと、安全なコードが出来ます。

しかしながら、もしもっと良いコードを書きたいと思えば、グローバル変数を使わない方が良いです。

var Ans = 0;

のように var を先頭に入れる事で関数内でだけ有効な変数が作れます。
ローカル変数は関数の実行が終了すると同時に解放されます。

- 0
- 件

通報する

No.1

回答者： 0909union
回答日時：2010/06/07 17:10

＞特になくても困らないと思うのですが、なぜ入れているのでしょうか？

たぶん学習途中なので、そう思うかもしれません。基本的に自動で変数が初期化されて、どんな値でもはいるようになっています。

これは、実はプロのプログラマー的(C, C++, javaなど)には、「そんなもの怖くて使えない」と言う事になります。なぜか？

自動　＝　オート変数　＝　設定されていた値が保障されない

となります。実際、業務用ソフトではオート変数はほとんど使われません。私も、そのような実例を見ていて、本来”０”が入っているはずが、”１”が入る時がある？　突き止めたら、リソースなどなくなり、メモリーを確保、リリースを繰り返してゆくと、オート変数として宣言されていたため、犯されていた可能性がある、と言う事で、３０００万円以上の代償を払った経験があります。

JavaScriptも例外ではありません。この程度の長さでは、ほとんど見られませんが、ユーザー定義の関数や、クラスが１０、５０、１００以上になると、同じ名前の変数が結構使われます。

そうすると、意図しない値が変数を初期化していないために、入っていて誤動作を起こします。

例として
for(a=1; a>10; a++){

とした場合、動作しますが、他のところで同じループをかくと、あれ？　ループが１回も実行されない。なんて事があります。そうならないためには

for(var a=1; a>10; a++){

なぜ？　と思わないで、安全のために、誤動作をさせないようにするために、おまじないと思ってください。

これは５００行以上の物を作ればわかります。