Javascript 使通过函数加载的JSON可用于其他函数

我试图用JS函数加载JSON，然后使加载的JSON对象可用于同一命名空间中的其他函数。我尝试使用return来提供检索到的对象数组，但这不起作用。在所附的示例中，我已将对象数组指定给命名空间对象中的属性，但当我尝试在主loadData函数之外获取该对象数组时，得到的结果都是null

以下是我的JS：

var myObj={
jsonEndPoint:“/test/test.json”，
数据对象：null
}
myObj.loadData=函数（）{
$.ajax({
url:'test.json'，
键入：“POST”，
数据类型：“json”，
成功：功能（数据）{
myObj.dataObjects=data.apiResults[0]。联赛。赛季。选秀。回合[0]。选秀；
//log（myObj.dataObjects）；
},
错误：函数（xhr、textStatus、errorshown）{
console.log（'数据加载错误：'+textStatus）；
}
});
}()
myObj.displayData=函数（）{
console.log（myObj.dataObjects）
}（）

您的

displayData

方法甚至在ajax完成之前就被调用了。因此，您要么需要在ajax的成功回调中调用displayData，要么稍微改变一下结构，使其易于调用

你为什么不做这样的事呢

var myObj = {
  jsonEndPoint: '/test/test.json',
  dataObjects: null,
  displayData: function() {
    console.log(this.dataObjects);
  },
  loadData: function() {
    $.ajax({
      context: this,
      url: 'test.json',
      type: 'GET',
      dataType: 'json',
      success: function(data) {
        this.dataObjects = data.apiResults[0].league.season.draft.rounds[0].picks;
        console.log(myObj.dataObjects);
        this.displayData();
      },
      error: function(xhr, textStatus, errorThrown) {
        console.log('Data Load Error: ' + textStatus);
      }
    });
  }
};

myObj.loadData();

---

这里有一个

，这是因为JavaScript本质上是异步的——当您试图访问

myObj.displayData

函数中的

myObj.dataObjects

时，该对象还不存在，因为AJAX调用尚未完成

您可以使用

$.when（）

确保所有需要从AJAX调用中添加新数据的函数只有在AJAX调用中传递了

.done（）

承诺时才能运行。逻辑相当简单：

myObj.loadData（）

现在专门用于进行AJAX调用。关于如何处理完成和失败事件（以前是

.success（）

和

.error（）

回调），我们将该逻辑委托给下一个函数

myObj.displayData（）

现在用于评估使用

myObj.loadData（）

进行的AJAX调用所返回的承诺。您可以使用

$.when（）

获取承诺，然后简单地连锁

.done（）

来处理成功的调用，

.fail（）

来处理相反的调用：）

以下是您的改进代码：

var myObj = {
    jsonEndPoint: '/test/test.json',
    dataObjects: null
}

myObj.loadData = function () {
    // We return the AJAX object so that we can evaluate the state later
    // This is very simple :) 
    return $.ajax({
        url: 'test.json',
        type: 'POST',
        dataType: 'json'
    });
}()

myObj.displayData = function() {
    // Instead of using the deprecated .success() and .error()
    // ... we use .done() and .fail()
    $.when(myObj.loadData).done(function(data) {
        myObj.dataObjects = data.apiResults[0].league.season.draft.rounds[0].picks;
    }).fail(function(xhr, textStatus, errorThrown) {
        console.log('Data Load Error: ' + textStatus);
    });
}()

---

如果您不确定，您可以在这里检查伪代码：我使用了JSFIDLE的内置JSON响应来生成一个人工响应，但逻辑与您的完全相同。

您的

displayData

在ajax完成之前被调用。所有答案都针对竞争条件，但是我选择了您的答案，因为您使用$.when和$.done的示例在我尝试做的上下文中最有意义。谢谢