即使它存在,我也无法访问数组内的对象

时间:2018-01-03 07:28:56

标签: javascript json javascript-objects

此方法将从firebase数据库检索到的JSON对象存储到数组分数。

function loadScoresToArray(){
    databaseRef.orderByChild("Score").on("child_added", function (snap) {
        scores.push(snap.val());
    });
}

运行上述方法并打印分数内容

loadScoresToArray();
console.log(scores);

console.log(scores[0]);

输出

enter image description here

如此处所示,对象已正确添加到分数中。

但我无法使用索引检索它们。

阅读this之类的类似问题我认为这可能是因为调用console.log(scores[0]);时,数组仍为空。它尚未填充。这只是我的猜测。

我该如何解决这个问题?有没有办法在填充数组之前创建延迟?

1 个答案:

答案 0 :(得分:4)

  

但我无法使用索引检索它们。

那是因为您正在执行异步操作。而不是等待response执行立即继续,并且执行请求调用后的语句。

  

我该如何解决这个问题?有没有办法在数组之前创建延迟   是填充?

不,不要使用延迟。您可以使用callback功能。

function loadScoresToArray(callback){
    databaseRef.orderByChild("Score").on("child_added", function (snap) {
        scores.push(snap.val());
        callback(scores);
    });
}

loadScoresToArray(function(scores){
  console.log(scores[0]);
});

另一种解决方案是使用Promise构造函数来执行异步操作。

function loadScoresToArray(){
    return new Promise(function(resolve, reject){
        databaseRef.orderByChild("Score").on("child_added", function (snap){
           scores.push(snap.val());
           resolve(scores);
        });
    });
}

loadScoresToArray().then(function(scores){
     console.log(scores[0]);
});

以下是解决问题的可行方法。

  • 使用async / await承诺ES2017+
  • 回调
  • 承诺与then()ES2015+