chrome.tabs.queryの内側にpush（）を配置すると適切に配列に追加されない

Question

このサイトで試行錯誤して複数のクエリを実行しても自分自身を理解できないという問題があります。

私は基本的にChromeで開いているすべてのタブのタイトルを持つ配列を埋めるためにしようとしますが、自分の目で確かめてくださいよ：

var children = []; 

function updateList(){ 
    chrome.tabs.query({}, function(tabs){ 
     for(i = 0; i < tabs.length; i++){ 
      children.push(tabs[i].title); 
     } 
    }) 
    children.push("test") 
} 


console.log(children); 
console.log(children.length); 
updateList(); 
console.log(children); 
console.log(children.length); 

私の問題は、私はプッシュ（よ配列エントリ）ということです - タブのクエリの内部は、配列のように実際には処理されません。私は配列を調べているときにコンソールに表示され、Chromeに基づいて長さを変更しますが、配列の長さを記録するとカウントされません。

children[2] 

は、私がこれを引き起こしているものは考えているが、私はここで誰かが何であるかを私に言うことができることを願っています：NOR私のような何かをすることによって、それらにアクセスすることができます！

---

EDIT： わかりましたので、私はいくつかの理由のために手動でクロームコンソールの配列の長さをチェックするために試していませんでしたが、私は今ことをやりました。長さは正しいので、クエリが有効になるには時間がかかりすぎるようです。今質問は、私のプログラムがクエリが終了するのを待たせる方法です。

Answer 1

が非同期であるため、コールバックが必要です。 queryコールバックが完了したことを確認するには、のように自分自身を次のように追加します。

var children = []; 

function updateList(callback){ 
    chrome.tabs.query({}, function(tabs){ 
     for(i = 0; i < tabs.length; i++){ 
      children.push(tabs[i].title); 
     } 

     children.push("test") 
     if (callback) { 
      console.log('calling updateList callback'); 
      callback(); 
     } 
    }) 
} 


console.log(children); 
console.log(children.length); 
console.log('calling updateList') 
updateList(function() { 
    console.log('in updateList callback'); 
    console.log(children); 
    console.log(children.length); 
}); 
console.log('called updateList');