Ajax 是 Asynchronous JavaScript and XML的縮寫,非同步請求的概念。
- Asynchronous:非同步
- JavaScript:使用的程式語言
- XML:Client 與 Server 交換資料用的資料與方法,近年由於 JSON 等格式的流行,使用 Ajax 處理的資料並不限於 XML。
非同步
當你在使用 DOM 事件時,其實你已經在運用非同步的概念,你不知道事件什麼時候會發生,但你可以先把要發生的函式準備好,等到事件發生時,就進行處理。
FB留言刷新時不用刷新整個網站就是用到非同步處理
例
let ary =[];
axios.get('https://hexschool.github.io/ajaxHomework/data.json')
.then(function (response) {
ary = response.data;
console.log('有回傳');
});
console.log(ary);
同步請求 v.s. 非同步請求
-
同步請求 (Synchronous request): 客戶端 (client) 對伺服器端 (server) 送出 request ,並且在收到伺服器端的 response 之後才會繼續下一步的動作,等待的期間無法處理其他事情。這個作法並不理想,因為通常伺服器端的運算速度比本地電腦慢上好幾倍。
-
非同步請求 (Asynchronous request):客戶端 (client) 對伺服器端 (server) 送出 request 之後,不需要等待結果,仍可以持續處理其他事情,甚至繼續送出其他 request。Responese 傳回之後,就被融合進當下頁面或應用中。
JSON
- 屬性都是字串型別
- 一律使用雙引號
- 其他都跟物件一樣
- JSON 它並不是 Javascript 的物件 他是字串便於在網路上傳遞
當使用AJAX框架時會自動轉換為JS物件格式
補充
(圖片來源:六角學院)
(圖片來源:六角學院)
參考