# AJAX - 非同步觀念(上)

## 同步與非同步

延續上一篇，我們在完成 AJAX 請求並成功撈到資料後，勢必我們會想用 **xhr.responseText** 來取的資料的值

var xhr = new XMLHttpRequest();
xhr.open('get','https://hexschool.github.io/ajaxHomework/data.json',true);
xhr.send(null);

console.log( xhr.responseText );

好了! 興致勃勃回去看 console，奇怪怎麼是空值，再看一下 **XMLHttpRequest** 物件的屬性 **responseText** 明明就有資料，為甚麼我抓不到呢?


這時就關乎於我們剛剛沒講到的**同步與非同步**設定值了

xhr.open('get','https://hexschool.github.io/ajaxHomework/data.json',true);

- **true**: 非同步，再取得資料的過程中，程式碼會繼續往下跑，不會等待資料取得
- **false**: 同步，會一直等到資料取得完成才繼續往下跑

我們找到問題點了! 原來是因為我們設定了非同步，因此程式碼在 **xhr.send(null);** 後 不會等到取得值，會接著跑下一行 **console.log( xhr.responseText );** ，因為到這行時其實還沒完成資料取得(程式碼跑很快)，所以抓不到值。

後面會接著說明非同步的情況下該如何取得資料!

---

## 同步與非同步哪個好

你會說，啊那這樣我用同步就好啦! 才不會撈不到資料，但是如果今天你要撈的資料檔案很大，你要等他完全取得完成，程式碼才往下跑，網站肯定會停擺好大一段時間，對於使用者來說就是很大的不方便，所以一般我們還是都使用**非同步true**居多

###### tags: `AJAX`