2016-05-01 13 views
0

React-NativeでFirebaseからオブジェクトを取得し、その内容を配列にプッシュする関数を定義しました。しかし、配列は 'push'を呼び出した後に正しく配置されていますが、forループの最後には定義されていません。なぜ私はそれがクリアされているのかわからない、私はforループの外に配列を定義しているので、私は何かが不足している場合のために余分なペアのペアを求めるだろうと思った。配列はjavascript関数の外で未定義ですか?

var newList = []; 
    var arrayLength = userArray.length; 
    for (var i = 0; i < arrayLength; i++) { 

     var userRef = usersRef.child(userArray[i]); 
     userRef.once('value', function(snap) { 
      newList.push({ 
       name: snap.val().name, 
       description: snap.val().description, 
      }); 
      //this log statement prints out correct array 
      console.log("NEWLIST" + newList[i]); 
     }); 
     //but array is undefined here 
     console.log("NEWLIST 2" + newList[i]); 
    } 
    this.setState({ 
     current: this.state.current.cloneWithRows(newList), 
     past: this.state.past.cloneWithRows(oldList) 
    }); 
+3

アレイはクリアされていませんが、 'NEWLIST 2'をログに記録するとまだ入力されていません。データは非同期にロードされ、コードは結果を待たずに(ユーザーのために幸いです)。あなたのロギングは、それらが表示される順番でそれを表示する必要があります: 'NEWLIST 2'と' NEWLIST'だけです。この現象についての詳しい説明は、http://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call –

+1

を参照してください。[私の変数は変更後も変更されませんそれは関数の中で?](https://stackoverflow.com/questions/23667086/why-is-my-variable-unaltered-after-i-modify-it-inside-of-a-function-asynchron)と[ループ内のJavaScriptクロージャ](https://stackoverflow.com/questions/750486/javascript-closure-inside-loops-simple-practical-example) –

答えて

1

コードはうまく見えますが、私がここで起きていると思われることは、userRef.once()が非同期呼び出しであり、外側がconsole.logが最初に実行されていることです。イベントがコールバックをトリガーすると、は値を出力します

1

JavaScriptの非同期性を参照してください。 関数はコールバックをとります。外部スコープのconsole.logは、配列の項目情報をプッシュする前に実行されます。

関連する問題