本文實例講述了javascript異步處理與Jquery deferred對象用法。分享給大家供大家參考，具體如下：
這是項目組老大整理的一些關于jquery 異步處理請求，以及使用 jquery deferred 對象的一些常見方法。雖然是項目上總結出來的。但也比較通用，分享在這里。
$.Ajax函數的返回值不代表返回的結果，只是一個Deffered對象。done(), fail(), always()函數來執行。例如：
function readData(){ $.ajax({ url:"test", dataType:"json" }) .done(function() { //.... });}readData();//...這里想添加一些后續處理，但程序將在Ajax回調前執行，所以無法達到預期目的正確的代碼：function readData(){ return $.ajax({ url:"test", dataType:"json" }) .done(function() { //.... });}readData().done(function () { //...想添加的后續處理可以加在這里處理});when()函數來同時執行，以提高程序的運行效率和可讀性。promise()，可以阻止其他代碼修改deferred對象的狀態，也就是其他代碼調用reslove()和reject()無效。var dtd = $.Deferred(); // 新建一個Deferred對象var wait = function(dtd){ var tasks = function(){ alert("執行完畢！"); dtd.resolve(); // 改變Deferred對象的執行狀態 }; setTimeout(tasks,5000); return dtd;};wait(dtd).done(function(){ alert("成功了！"); }).fail(function(){ alert("出錯啦！"); });dtd.resolve(); //這里修改了dtd對象的狀態，導致立刻出現“成功了！”的提示正確的例子：
var dtd = $.Deferred(); // 新建一個Deferred對象var wait = function(dtd){ var tasks = function(){ alert("執行完畢！"); dtd.resolve(); // 改變Deferred對象的執行狀態 }; setTimeout(tasks,5000); return dtd.promise(); // 返回promise對象};wait(dtd).done(function(){ alert("成功了！"); }).fail(function(){ alert("出錯啦！"); });dtd.resolve(); //這里修改dtd對象的狀態無效1.嵌套異步操作的處理。
如果一個函數內部執行異步任務，并且在異步任務的done回調內會嵌套另一個異步任務，那么簡單返回第一個異步任務的返回值是不行的，需要另外自行定義一個Deferred對象作為返回值。
function loadComponent(id){ var dtd = $.Deferred(); //loadScript將異步加載一個js文件，所以返回值是一個Deffered對象 return loadScript(id) .done(function() { //js加載后，觸發component的load事件，此事件內將使用Ajax獲取頁面模板和數據，生成最終的html app.getComponent(id).trigger("load") .done( function(){ dtd.reslove(agruments); }).fail( function(){ dtd.reject(agruments); }); }); //返回自定義的dtd對象，才能保證返回值的done回調在load事件完成后執行 return dtd;}2.一個函數內同時包含同步和異步case的處理。
/* 這個函數返回一個異步對象，當異步對象執行done時，表示component被加載完成 */function requireComponent(id){ if (this.components[id]){ //如果component已經被加載，直接返回一個reslove的異步對象，否則返回值內容與else分支不同，后續代碼難以處理 var dtd = $.Deferred(); dtd.reslove(this.getComponent(id)); return dtd; } else{ //如果component未被加載，loadScript將異步加載JavaScript并執行，然后將被加載的component放入this.components return loadScript(id); }}wait操作的處理能力，如果多個異步調用要順序發生時，就要在done里面嵌套處理，影響代碼可讀性.aSyncTask1.done( function () { //...第一個操作完成后的處理 asyncTask2.done( function () { //...第二個操作完成后的處理 asyncTask3.done( function () { //...第三個操作完成后的處理 }); })})更多關于jQuery相關內容感興趣的讀者可查看本站專題：《jQuery form操作技巧匯總》、《jQuery文件與目錄操作技巧匯總》、《jquery中Ajax用法總結》、《jQuery擴展技巧總結》、《jquery選擇器用法總結》及《jQuery常用插件及用法總結》
希望本文所述對大家jQuery程序設計有所幫助。
新聞熱點
疑難解答
