shiki0331’s blog

Web Developer. TypeScript / React.js を中心に学んでいます。 ブログ内容で間違っている箇所などありましたら、ご指摘していただけると助かります。

ajaxとは?非同期通信とは?

ajaxの前に非同期通信を理解した方がスムーズに学べると思います。

 

なので非同期通信から説明していきます。

 

非同期通信とは簡単に言うと

サーバーからの応答を待たずに処理を行うことです。

 

詳しく説明すると

通常であればホームページを閲覧するときには、Webブラウザからサーバーに情報を要求します。

 

その要求に対してサーバーは応答し、情報をWebブラウザに返します。

 

つまり、非同期通信とはWebブラウザの要求に対してサーバーからの応答がくる前に処理を行うことです。

 

 

次は本題のajaxです。

 

ajax

Asynchronous JavaScript XML です。

 

XMLを知らない人は、ここではHTMLに似たものと思っておいてください。

 

ajaxとは簡単に言うと

JavaScriptを用いて非同期通信を行うことです。

 

先ほど非同期通信はWebブラウザの要求に対してサーバーからの応答が〜〜と説明しましたね。

 

そのWebブラウザの部分がJavaScriptに置き換わったと考えるとわかりやすかもしれません。

 

つまり、ajax とは非同期通信でのJavaScriptとサーバーのやり取りです。

 

同期通信と非同期通信では画面上にどのような違いが生じるかというと

 

 

ホームページのリンク先や更新ボタンをクリックすると、一瞬画面が白くなって上のタブにある丸いアイコンがくるくる回りますよね。

 

これは同期通信です。

 

非同期通信ではページが白くならずにアイコンも回りません。

 

ツイッターのフォローボタンとかがそうですね。

 

これが非同期通信です。

 

説明が雑になってしまいましたね、、

 

 

最後まで読んで頂きありがとうございます。

何か間違っている箇所などありましたら、ご指摘して頂けると助かります。