3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

[JS]レスポンスの処理

Posted at

学習したことのアウトプット
#まず
ブラウザでイベント発火

JavaScript

ルーティング

コントローラー
レスポンス
JavaScript

ブラウザ

レスポンス部分の処理の書き方の理解を少しでも深められたらと
#XMLHttpRequestオブジェクト
JavaScriptを用いてサーバーとHTTP通信を行うときに利用するオブジェクト。
XMLHttpRequestのメソッドやプロパティを利用して実装を進めます。

記述例
const XHR = new XMLHttpRequest();

new XMLHttpRequestと記述することで、新しくオブジェクトを生成できます。
そして、新たに生成したXMLHttpRequestオブジェクトを変数XHRに格納しています。

変数名のXHRはXMLHttpRequestの略です。
##onloadプロパティ
リクエストの送信が成功したときに呼び出されるプロパティでXMLHttpRequestオブジェクトのプロパティの一種です。
onloadプロパティで、リクエストの送信に成功したときに行う処理を定義できます。

XHR.onload = () => {
//リクエストが成功したときの処理を書く
};

関数(上記はアロー関数を使用)を使用して中にリクエストが成功した場合の処理を書く

##responseプロパティ
サーバーからのレスポンスに関する情報が格納されたプロパティのことで、XMLHttpRequestオブジェクトのプロパティの一種です。

記述例
XHR.onload = () => {
 console.log(XHR.response);
};

上記の場合、リクエストが成功するとレスポンスに関するデータをコンソールに出力することができる。

#最後に
JavaScriptってヘビーに見えるけどコツを掴むとなんとかなりそうな気もする(笑
それでも今のところは難しく感じてるけど・・・

※補足等あればコメントいただけると幸いです。

3
0
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?