回調叫當任務完成或已經完成

Question

我有一個簡單的代碼，包括異步任務：

// The NewsFeed Class 

function NewsFeed() { 

    this.loadFeed = function() { 
     $.ajax({ 
      url: "http://www.example.com", 
      success: function() { 
       // doSomething here, and call onload. 
      } 
     }); 
    } 

    // Need to implement onload here somehow 
    this.onload = ?; 

    this.loadFeed(); 
    return this; 

} 
NewsFeed.constructor = NewsFeed; 



// In main JS file 
var newsFeed = new NewsFeed(); 
$(function() { 
    // do something 
    newsFeed.onload = function() { // do something when news feed is loaded }; 
} 

我的要求是，新聞推送的onload需要在這兩個情況下要執行：

• 如果loadFeed的ajax已完成，請立即運行它。
• 如果loadFeed的ajax還沒有完成，請運行它。

Answer 1

真的沒有必要使用new或constructor當你不需要新的情況下，你真正需要的是運行一個簡單的Ajax功能，從緩存中獲取結果，如果它沒有改變。

function newsFeed() { 
    return $.ajax({ 
     url : "http://www.example.com", 
     cache : true // let the browser handle caching for you 
    }); 
} 


// In main JS file 
$(function() { 
    newsFeed().then(function() { 
     // do something when news feed is loaded 
    }); 
}); 

Answer 2

的新格局，而不是回調使用承諾 看到： https://github.com/kriskowal/q

與jQuery你可以使用： https://api.jquery.com/category/deferred-object/

現在代碼：

function NewsFeed() { 
 

 
    function loadFeed() { 
 
     var deferred = $.Deferred(); 
 
     $.ajax({ 
 
      url: "http://www.example.com", 
 
      success: function(data) { 
 
       deferred.resolve(data); 
 
      }, 
 
      error: function(data) { 
 
       deferred.reject(data); 
 
      } 
 
     }); 
 
     return deferred.promise(); 
 
    } 
 

 
    this.loadFeed = loadFeed; 
 
    return this; 
 

 
} 
 
NewsFeed.constructor = NewsFeed; 
 

 

 

 
// In main JS file 
 
var newsFeed = new NewsFeed(); 
 
newsFeed.loadFeed().done(function(data){ 
 
    //data loaded successfully 
 
}) 
 
.fail(function(data){ 
 
    //ajax request failed 
 
}) 
 
.always(function(){ 
 
    //finally: 
 
});