- 締切済み
javascriptで困っています。教えてください
新JavaScript例文辞典のJSONデータを解析して読み込む http://www.openspc2.org/reibun/javascript2/JSON/parse/0001/ を参考にjsonを扱うことを勉強してるのですが、以下のようにすると、関数の中の変数n,pには、読み込んだ値が代入されているのですが、関数の外の変数nには値がなくなり、変数pには代入されています。原因が分からず困っています。よろしくお願いします。 <!doctype html> <html> <head> <meta charset="utf-8"> <title>無題ドキュメント</title> <script type="text/javascript"> var n; var p; httpObj = new XMLHttpRequest(); httpObj.open("get", "jsondata.txt", true); httpObj.onload = function(){ var myData = JSON.parse(this.responseText); n = myData.item[0].itemName; p = myData.item[0].itemPrice; alert("関数の中のn="+n); alert("関数の中のp="+p); } httpObj.send(null); alert("関数の外のn="+n); alert("関数の外のp="+p); </script> </head> <body> </body> </html> ---------------------------------------------------------- 【JSONデータ：jsondata.txt】 {"item":[ { "itemCode":91, "itemName":"塩ラーメン", "itemPrice":300}, { "itemCode":94, "itemName":"味噌ラーメン", "itemPrice":290}, { "itemCode":95, "itemName":"豚骨ラーメン", "itemPrice":320} ] }
- dkong
- お礼率86% (170/197)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
みんなの回答
関数の外側にある、 alert("関数の外のn="+n); alert("関数の外のp="+p); これが実行されたとき、まだnとpにはおそらく値が設定されてない、ということは理解できていますか？ XMLHttpRequestによるAjax通信は、非同期です。httpObj.sendを実行すると、ただ通信を開始しただけで、（通信結果を受け取る前に）すぐにつぎのalertが実行されます。 そしておそらくalertの表示中（１つ目のalertが表示されているあたり？）で通信が終了し、変数に値が代入されます。 このため、alert("関数の外のn="+n);ではnは空っぽであり、alert("関数の外のp="+p);ではJSONの最初の値が取り出されています。 非同期通信というものの働きについて調べてみるとよいと思います。
お礼
ありがとうございました。非同期通信のことがよく分かってなかったので、勉強してます。