淺談js的ajax的非同步和同步請求的問題_javascript技巧

先來看以下代碼：

var flag=true;var index=0;$.ajax({  url: "http://www.jb51.net/",  success: function(data){    flag=false;  }  });while(flag){  index++;}alert(index);

請問最後alert的index的結果是多少？

可能有人會說0唄。實際上卻沒那麼簡單。大家可以自己試試看。可以看到最終程式進入了一個死迴圈！怎麼會這樣呢！

我們在看一段代碼：

var flag=true;$.ajax({  url: "http://www.jb51.net/",  success: function(data){    flag=false;  }  });alert(flag);

大家看最後alert出flag的值是多少呢？沒錯，是true！為什麼呢？明明我們在ajax請求成功了將flag設為false，怎麼還是true呢？這實際上是Ajax的非同步機製造成的。

這裡解釋一下，同步和非同步。js是單線程的，由於執行ajax請求會消耗一定的時間，甚至出現了網路故障而遲遲得不到返回結果；這時，如果同步執行的話，就必須等到ajax返回結果以後才能執行接下來的代碼，如果ajax請求需要1分鐘，程式就得等1分鐘。如果是非同步執行的話，就是告訴ajax代碼“老兄，既然你遲遲不返回結果，我先不等你了，我還有一大堆代碼要執行，等你執行完了給我說一下”。

Ajax預設是非同步請求的，所以就出現了上面我們看到的結果。也就是ajax裡面的代碼還沒有執行完，先執行了下面的代碼。

那麼如何使Ajax執行同步請求呢？這就需要設定async。

代碼如下：

var flag=true;var index=0;$.ajax({  url: "http://www.jb51.net/",  async:false,  success: function(data){    flag=false;  }  });while(flag){  index++;}alert(index);

async預設是true，也就是非同步，我們設定為false，即為同步。這時我們再看看結果吧。

以上就是小編為大家帶來的淺談js的ajax的非同步和同步請求的問題全部內容了，希望大家多多支援雲棲社區~