- ベストアンサー
JavaScriptの変数と関数の使い方について
- JavaScriptの変数と関数の使い方について質問があります。変数の宣言を関数の中で行うと正しく動作しますが、関数の外で宣言すると結果がNaNになってしまいます。なぜでしょうか？変数の宣言は関数の外でも行えるのでしょうか？
- JavaScriptの変数と関数の使い方について質問があります。関数の外で変数を宣言すると、結果がNaNとなってしまいます。関数の中で宣言すると正しく動作します。なぜ関数の外で宣言するとNaNになるのでしょうか？
- JavaScriptの変数と関数の使い方について質問があります。関数の外で変数を宣言しても結果がNaNになってしまいます。しかし、関数の中で宣言すると正しく動作します。なぜ関数の外で宣言するとNaNになるのでしょうか？
- makiko3300
- お礼率4% (2/48)
- JavaScript
- 回答数3
- ありがとう数5
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
変数のスコープに関しては、問題ないと思います。 関数の外で宣言された変数は var を付けても、グローバル変数となります。 <script type="text/javascript"><!-- var foo = 'foo'; // 関数の外なので、グローバル変数扱い function test(){ alert(foo); // グローバル変数なので、参照できる } test(); //--></script> 問題は#1さんの仰るように、実行のタイミングですね。 あと、これは後になって出てくる問題ですが、<input> からローカル変数に代入した値も明示的に数値型に変換しないと文字列型として扱います。 Number - MDC https://developer.mozilla.org/ja/Core_JavaScript_1.5_Reference/Global_Objects/Number Javascriptで、以下の様な足し算をする場合、 | OKWave http://okwave.jp/qa/q5896295.html
その他の回答 (2)
- think49
- ベストアンサー率59% (285/482)
#2です。 > あと、これは後になって出てくる問題ですが、<input> からローカル変数に代入した値も明示的に数値型に変換しないと文字列型として扱います。 失礼。 減算だと自動的に数値型に変換されるようです。 加算だと文字列連結になってしまうのですが…。 ただ、どちらにしても明示的に数値型に変換した方が問題は少ないと思います。
- nekohigex
- ベストアンサー率20% (1/5)
2つの誤解があります。 1つはスコープ、もう一つは動作のタイミングです。 ●スコープについて varで宣言された変数はローカル変数になります。 関数の外でローカル変数として宣言された変数は、関数の中で使用することができません。 var moneyin = document.form1.text1.value; ←ローカル変数 var moneyout = document.form1.text2.value; ←ローカル変数 function zandaka(){ document.form1.text3.value=moneyin-moneyout; //↑moneyinとmoneyoutはまだ宣言されていない（NaN)。 // なぜなら、moneyinとmoneyoutは zandaka()の外で宣言されたローカル変数であり、 // zandaka()から参照することができないから。 } 関数の外で宣言された変数を関数の中で使うには、グローバル変数として宣言します。 グローバル変数として宣言するには、varを省略します。 moneyin = document.form1.text1.value; ←varを消す（グローバル変数） moneyout = document.form1.text2.value; ←varを消す（グローバル変数） function zandaka(){ document.form1.text3.value=moneyin-moneyout; //これならNaNにはならない。 //なぜならmoneyin,moneyoutはグローバル変数として宣言されているから。 } ただし、このままでは収入と支出を変更しても、残高は0のままです。これは想定している動作では無いはずです。 原因は動作のタイミングの違いです。 ●動作のタイミング 関数の外に書いてある処理は、そのコードが「読まれた」時に実行されます。 関数内に書かれている処理は、「呼び出された」時に実行されます。 moneyin = document.form1.text1.value; ←ページを読み込んだときに""を設定 moneyout = document.form1.text2.value; ←ページを読み込んだときに""を設定 function zandaka(){ ←「残高」を選択したときに呼び出される document.form1.text3.value=moneyin-moneyout; //収入、支出を変更しても、moneyin,moneyoutは0のまま。 //なぜなら、moneyin,moneyoutはページを読み込んだときに""が設定されたまま、 //更新されていないから。 } 「残高」を選択した際に、その都度収入と支出を読み込む様にするには、 moneyin = document.form1.text1.value; moneyout = document.form1.text2.value; を zandaka(）の中に入れる必要があります。 function zandaka(){ ←「残高」を選択したときに呼び出される moneyin = document.form1.text1.value; ←収入を読み込み moneyout = document.form1.text2.value; ←支出を読み込み document.form1.text3.value=moneyin-moneyout;←計算 } ただ、この場合、moneyin,moneyoutは関数の中で使用されるので、グローバル変数である必要はありません。 なので、varでローカル宣言にしてあげましょう。 function zandaka(){ ←「残高」を選択したときに呼び出される var moneyin = document.form1.text1.value; ←収入を読み込み var moneyout = document.form1.text2.value; ←支出を読み込み document.form1.text3.value=moneyin-moneyout;←計算 }
