JQuery嵌套$ .when，以防止競爭條件

Question

所以我讀了幾篇文章，如this和this如何做到這一點，但我解決了似乎適用於此內部LOB應用程序的其他東西。我在加載現有的「分配」之前異步加載數據庫依賴關係（即在加載部門，部門等之前試圖加載getAllocation（），getAssignedAssts（）等），所以我只放了第二個$。當/完成調用內部的依賴關係的doneCallback。就像這樣：

// assume allocationID is defined as allocation id we want to get from db 
$.when(getDept(), getDivisions(), GetAvailComments(), getTargets()) 
.done(function msg1, msg2, msg3, msg4) { 
    // initialize variables, knockout observables and observable arrays 

    $.when(getAllocation(allocationID), getAssignedAssts(allocationID), getAssignedTeachers(allocationID)) 
    .done(function msg1, msg2, msg3) { 
    }); 
}) 
.fail(function jqXHR, textStatus, errorThrown) { 
    alert('Error getting Allocation: ' + jqXHR.status + ' ' + textStatus + ', ' + errorThrown + '<br />' + jqXHR.responseText); 
}); 

假設getDept（），getDivisions（）等存在，並返回一個Ajax的承諾是這樣的：

function getDept() { 
    var data = { plan_id: getParameterByName('plan_id') }; 

    return $.ajax({ 
     type: "POST", 
     url: "Plan_Edit.aspx/PlanDept", 
     data: JSON.stringify(data), 
     contentType: "application/json; charset=utf-8", 
     dataType: "json" 
    }); 
}; 

我的問題是，這是否是壞的，如果是這樣，是什麼是做到這一點的「正確」方式？

Answer 1

我谷歌搜索「jQuery嵌套時」，發現this，我用它作爲起點返工this jsfiddle。我上面實現的代碼似乎沒有問題，就像這個例子所示 - 當第一個集合完成時，jquery在第二個時間調用，然後纔會調用它，這正是我想要的依賴關係。這裏是javascript代碼：

function message(html) { 
    $('<div/>').html(html).appendTo($('body')); 
} 

function process(){ 
    $.when(a1(), a2()).done(function(){ 
    message('a1 and a2 complete'); 

    $.when(a3(), a4()).done(function(){ 
     message('a3 and a4 complete'); 
    }); 
    }); 
} 

function a1(){ 
    var dfd = $.Deferred();   
    setTimeout(function(){ message("a1 done"); dfd.resolve(); },4000); // can use console.log or message 
    return dfd.promise();   
} 

function a2(){ 
    var dfd = $.Deferred(); 
    setTimeout(function(){ message("a2 done"); dfd.resolve(); }, 2500); 
    return dfd.promise(); 
} 

function a3(){ 
    var dfd = $.Deferred(); 
    setTimeout(function(){ message("a3 done"); dfd.resolve(); }, 3000); 
    return dfd.promise(); 
} 

function a4(){ 
    var dfd = $.Deferred(); 
    setTimeout(function(){ message("a4 done"); dfd.resolve(); }, 2000); 
    return dfd.promise(); 
} 

process();