part1のリンクを貼っておきます。
part1
レスポンス処理
前回の続きです。
レスポンス処理にはonreadystatechangeプロパティをもちいます。onreadystatechangeプロパティはサーバ通信の変化を表すイベントです。onreadystatechangeプロパティはreadyStateプロパティを参考に発火します。
javascriptの連語は、文字の区切りを大文字にするのが通例です。
このonreadystatechangeは文字の区切りを大文字にしないのはなぜなのでしょうか。もしわかるかたコメントよろしくお願い致します。
| 値 | 通信状態 | 詳細 |
|---|---|---|
| 0 | UPSET | XMLHttpRequestオブジェクトが生成されたら |
| 1 | OPENED | open()メソッドが呼び出された |
| 2 | HEADER_RECEIVED | send()メソッドが呼び出せれて、レスポンスヘッダ(レスポンスデータのサイズ 、データ形式を受信した状態 |
| 3 | LOADING | データをダウンロード中 |
| 4 | DONE | データ通信完了 |
では、実際にどのように使うのか
レスポンス処理
//通信状態が変化したときに実行される
xml.onreadystatechange= function(){
//通信が完了したら以下をじっこうする
if(xml.readyState == 4){
alert("通信完了");
}
}
このようにしてデータのやりとりができます。
例
<script>
//XMLHttpRequestオブジェクトの生成
var xml = new XMLHttpRequest();
//通信方式,URL,非同期処理の有無を設定
xml.open("GET","sample.dat",true);
//通信状態が変化したときに呼び出される関数
xml.onreadystatechange = function(){
if(xml.readyState == 4){
alert("xml.responseText");
}
}
//リクエストの送信
xml.send();
</script>
responseTextはプレーンテキスト形式のことです
sample.dat
Hello World
XMLHttpRequestを利用して外部ファイルからデータを取得することができました
文字列データかた数値データへの変換
リスト
x,y
0,0
1,1
2,8
3,27
4,64
このリストのものを文字列であらわすと
文字列表現
"x,y\n0,0\n1,1\n2,8\n3,27\n4,64\n"
改行が含まれます。
文字列のデータを数値データに変換するには以下の様な処理が必要です。
1.外部ファイルからの収得
2.文字列データを一行ごとに分解
3.1行ごとに分解された文字列からx,y座標を抽出
文字列データの分解の仕方
split()メソッドを利用というもので
split()
"分解したい文字列".split("区切り文字");
split()の例
var str = "1,2,3,4";
var ar = str.split(",");
alert("ar");
このようにして配列としてデータを保持できます
次回につづきます。