Ajaxとは

Ajaxとは

非同期通信を行い、ブラウザ、サーバー間でやり取りを行うこと。
「Asynchronous JavaScript + XML」の略です。XMLJSONだったりします。

同期通信と非同期通信について

  • 同期通信
    ブラウザからサーバーにリクエストを投げる際、全ての情報を送信する。
    その為、レスポンスが返ってくるまで他の作業を行えない!!
    画面遷移する際に一瞬白くなっているのは同期通信を行っているから。

  • 非同期通信 ブラウザからサーバーにリクエストを投げる際、一部の情報を送信する。 その為、レスポンスを待たずに他の作業を行える!!
    例としてはGooglemap。

Ajaxを行う為に使用されている技術

XMLHttpRequest

クライアントとサーバーの間でデータを伝送するための機能をクライアント側で提供する JavascriptAPI。 最近はモダンなAPIとしてfetchというのもあります。

DOM

Document Object Model」の略です。
以下のようにツリー状になっています。これのおかげでJavascriptはHTML要素の情報を取得することができます。

https://img.esa.io/uploads/production/attachments/2315/2020/10/14/53778/e25073b4-b622-4280-a957-8e626a228567.gif

参考 JavaScript HTML DOM

JSON

最近の主流だと思います。 プログラムが人間、コンピューター両方にとって読みやすいです。
また、JSONJavaScript のオブジェクトで構成されているため、そのまま JavaScript で記述したプログラムで扱うことができます。