ajax运行后调用闭包函数

Question

我是新来的模块模式和JavaScript中的闭包。我正在尝试创建一个获取JSON数据的模块，以便将其显示在我的网页上。

var EmailLogs = (function(){ 

    var emailLogs = []; 
    var config = {}; 

    function init(options){ 
     for(var prop in options) { 
      if(options.hasOwnProperty(prop)){ 
       config[prop] = options[prop]; 
      } 
     } 

     setEmailLogs(); 
    } 

    function setEmailLogs(){ 
     $.ajax({ 
      type: "POST", 
      headers : { "cache-control": "no-cache" }, 
      url: "../../ajax/adminGetEmailLogs.php", 
      data: {options: JSON.stringify(config)}, 
      dataType: 'json', 
      success: function(values){ 
       if(values.success) 
       { 
        emailLogs = values.emailLogs; 
       } 
      } 
     }); 
    } 

    function getEmailLogs(){ 
     return emailLogs; 
    } 

    return{ 
     init: init, 
     getEmailLogs: getEmailLogs, 
    } 

})(); 

var options = { 
     sData : [ 
      'email_id' 
     ], 
     filters : { 
      user_id : 44860, 
     } 
    } 

EmailLogs.init(options); 
console.log(EmailLogs.getEmailLogs()); 

我试图在init运行时运行ajax调用。然后我正在寻找获取emailLogs变量来显示。我认为，因为我的ajax正在运行异步，这就是为什么我无法获得我的变量。在运行getEmailLogs（）之前，如何确保setEmailLogs（）已经运行。

Answer 1

$.ajax()实现无极接口，并会返回一个Deferred对象，see the jQuery docs

的jqXHR对象由$。阿贾克斯（）在jQuery 1.5履行承诺的界面的返回，给他们所有的属性，方法，和Promise的行为（请参阅Deferred对象以获取更多信息）。

这意味着您可以使用承诺接口来确保在完成$.ajax()之后运行所需的方法。

修改您的代码以使用promise界面。基本上$.ajax()向您返回它将被执行的承诺。然后，您可以将您的下一个方法链接到执行完成后执行。你经常会看到这样的链接多个承诺模式（在伪代码）：

doAjaxRequest() 
    .then(doSomethingElse) 
    .then(doAnotherSomethingElse) 

这种方式oppossed到天堂了很多回调调用的海誓山盟，你可以写很干净异步代码。

The documentation for Q promises有一些很好的例子来解释承诺的工作方式。

我修改您的代码段使用的承诺：

var EmailLogs = (function(){ 

    var emailLogs = []; 
    var config = {}; 

    function init(options){ 
     for(var prop in options) { 
      if(options.hasOwnProperty(prop)){ 
       config[prop] = options[prop]; 
      } 
     } 

     setEmailLogs().done(function(values) { 
       if(values.success) 
       { 
        console.log(values.emailLogs) 
       } 
      }); 
    } 

    function setEmailLogs(){ 
     return $.ajax({ 
      type: "POST", 
      headers : { "cache-control": "no-cache" }, 
      url: "../../ajax/adminGetEmailLogs.php", 
      data: {options: JSON.stringify(config)}, 
      dataType: 'json' 
     }); 
    } 

    return{ 
     init: init, 
     getEmailLogs: getEmailLogs, 
    } 

})(); 

var options = { 
     sData : [ 
      'email_id' 
     ], 
     filters : { 
      user_id : 44860, 
     } 
    } 

EmailLogs.init(options);