ajax 同步請求和異步請求的差異分析

2019-11-20 23:46:20

字體：大中小

來源：轉載

供稿：網友

ajax同步和異步的差異，先看2段代碼：
代碼一：

 
Synchronize = function(url,param) { 
function createXhrObject() { 
var http; 
var activeX = [ "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ]; 
try { 
http = new XMLHttpRequest; 
} catch (e) { 
for (var i = 0; i < activeX.length; ++i) { 
try { 
http = new ActiveXObject(activeX[i]); 
break; 
} catch (e) {} 
} 
} finally { 
return http; 
} 
} 
var conn = createXhrObject(); 
conn.open("POST", url, false);//ajax同步 
conn.send(param); 
var strReturn = conn.responseText; 
alert("1"); 
if (strReturn != "") { 
return Ext.decode(conn.responseText); 
} else { 
return null; 
} 
alert("2"); 
}; 

代碼二：
Ajax 同步請求方式:

復制代碼代碼如下:

 
Synchronize = function(url,param) { 
function createXhrObject() { 
var http; 
var activeX = [ "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ]; 
try { 
http = new XMLHttpRequest; 
} catch (e) { 
for (var i = 0; i < activeX.length; ++i) { 
try { 
http = new ActiveXObject(activeX[i]); 
break; 
} catch (e) {} 
} 
} finally { 
return http; 
} 
} 
var conn = createXhrObject(); 
conn.open("POST", url, true);//ajax異步 
conn.send(param); 
var strReturn = conn.responseText; 
alert("1"); 
if (strReturn != "") { 
return Ext.decode(conn.responseText); 
} else { 
return null; 
} 
alert("2"); 
}; 

同步和異步的差異如下：

conn.open('POST',Url,true); // ajax異步
conn.open('POST',Url,false); // ajax同步

對于代碼二，為異步的ajax請求，執行結果為：先執行alert(2)再執行alert(1), 異步的意思就是說一旦conn.open請求一發出，前端不去等待它的響應便執行后面的代碼，所以alert(2)先執行了，然后當響應response到達以后才執行alert(1);

對于代碼一，為同步的ajax請求，執行結果為：先執行alert(1)再執行alert(2), 同步的意思就是說一旦conn.open請求一發出，前端就去等待它的響應，響應完成以后，alert(1)先執行了，然后alert(2);

上一篇：Javascript計算時間差的函數分享

下一篇：Extjs EditorGridPanel中ComboBox列的顯示問題