JQuery：延期與回調

Question

查看文檔，$ .Deferred和$ .Callbacks似乎做了非常類似的事情。我什麼時候想要使用一個？

回調：https://api.jquery.com/category/callbacks-object/

遞延：https://api.jquery.com/category/deferred-object/

Answer 1

他們不這樣做very similar things。 $.Callbacks被用作回調函數的容器，例如，假設你必須編寫一個接收10個回調的函數（作爲回調數組或者每個回調函數作爲參數），你必須循環回調數組和或者寫10行代碼（每個回調參數一行），現在有$.Callbacks，您可以將該對象傳遞給該函數（之前通過使用add方法將10個回調推送到該函數），然後只需致電callbacks.fire()，所有回調將被解僱。

實施例而不$.Callbacks和參數：使用$.Callbacks，將碼你

function doSomethingAndThenFireManyCallbacks(callbacks) { 
    //do something. 

    callbacks.fire(); 
} 

var callbacks = $.Callbacks(); 
callbacks.add([fn1, fn2, fn3, fn4, fn5, fn6]); 
doSomethingAndThenFireManyCallbacks(callbacks); 

通過：

function doSomethingAndThenFireManyCallbacks(cb1, cb2, cb3, cb4, cb5, cb6) { 
    //do something. 

    cb1(); 
    cb2(); 
    cb3(); 
    cb4(); 
    cb5(); 
    cb6(); 
} 

doSomethingAndThenFireManyCallbacks(fn1, fn2, fn3, fn4, fn5, fn6); 

實施例而不$.Callbacks和回調的數組：

function doSomethingAndThenFireManyCallbacks(callbacks) { 
    //do something. 

    for (var i = 0; i < callbacks.length; i++) { 
     callbacks[i](); 
    } 
} 

doSomethingAndThenFireManyCallbacks(fn1, fn2, fn3, fn4, fn5, fn6); 

實施例與$.Callbacks必須寫的是文件s，閱讀起來相當容易。

現在，作爲每$.Defered的事情，這是jQuery的實施承諾的API，它是一種處理用於asynchronous請求或過程，其中，代替通過回調一旦請求/處理完成將要執行的回調的另一種方法，你得到了一個承諾，它允許你鏈接你的功能。這樣代碼更容易閱讀和調試，因爲您的函數聲明和它的使用位於相同的位置，您不必猜測callback實際是或來自哪個參數函數。

無論如何，你應該閱讀更多關於promises，因爲我的解釋僅僅是說明$.Callbacks和$.Deferred之間的區別。

Answer 2

由於taxicala提到$ .Callabcks用於管理回調列表。

$ .Deferred當你需要監控的AJAX /無阻塞功能進展

Run this example to see the $.Deferred functionality

function nonBlocking() { 
    var defer = $.Deferred(); 
    // setTimeout is a non-blocking function 
    setTimeout(function() { 
     alert('Non-Blocking function call after thread ends'); 
     defer.resolve(); 
    }, 0); 
    return defer; 
} 

// Now you can chain a done or fail handler to the method call 
nonBlocking().done(function() { 
    alert('Non-Blocking function is done'); 
}); 

alert('End of main thread comes before the non-blocking function');