保存されたjavascriptのfacebook APIの応答は未定義のままですか？

Question

私はそれが非同期性の問題だと思う、 私はちょうど問題の周りに私の頭を得ることができません。 私は複数のapiリクエストを行い、レスポンスのリストを記入します。 次に、データをグラフ化するD3.jsスクリプト（ ）が未定義ですが、ここでは単純なログに置き換えています。 （もちろん、コンソールは後でリアルタイムで値を "評価"するが、ノード[0]の項目を記録することは実際には未定義である） 後続のスクリプトにはタイムアウトを設定したが、役に立たない、 と私はテストできなかった という要求が既にコールバックであるため、コールバックソリューションが必要です。 （私はforEachがここで使用する適切な方法ですけど、私もまた、私はまだ実現することができませんでした何かで即時復帰、との割り当て機能を取得しようとしている）

variables=["pageid1","pageid2","pageid3"]; 
nodes=[]; 
variables.map(function(variable){ 
    FB.api("/"+variable,"GET",{fields:'name,picture.type(large),engagement'},function(response){ 
     if(!response.error){ 
      nodes.push(response); 
     } 
    }); 
}); 
console.log(nodes); 

Answer 1

あなたは約束で要求をラップすることができます。すべての約束が解決されるのを待ってください。その場合は、ノード変数に応答が入力されます。 /非同期で

nodes=[]; 
function sendRequest(variable) { 
    return new Promise ((resolve, reject) => { 
     FB.api("/"+variable,"GET",{fields:'name,picture.type(large),engagement'},function(response){ 
      if(!response.error) 
       resolve(response); 
     }); 
    }); 
} 

Promise.all(variables.map(function(variable) { 
    return sendRequest(variable); 
})).then(values => { 
    /* All the responses are solved here */ 
    nodes = values.splice(0); 
    console.log( nodes); 
}); 

Answer 2

私はそれが非同期性の問題だと思われます。

もちろん、console.logは.apiが完了する前に起動できます。 setTimeoutでそれを遅らそうとするのはちょっとしたプログラミングです（推測ゲームです）。

nodesでの処理は、コールバックの.api内にある必要があります。 nodesを処理する前に複数の非同期呼び出しを終了して終了する必要がある場合は、d3.queueのようなものを使用してください。

キューは、構成可能な同時実行性を持つゼロ以上の遅延非同期タスクを評価します。同時に実行するタスクの数を制御します。 すべてのタスクが完了するか、エラーが発生すると、キューは結果を待ち受けコールバックに渡します。このライブラリはAsync.jsのパラレル（並行性が無限大の場合）、系列（並行性が1の場合）、およびキューに似ていますが、フットプリントははるかに小さくなります。リリース2では、d3-queueは約gzipped非同期の場合は4,300です。

あなたのケースでは、コードが（未テスト）のようになります。

var q = d3.queue(); 

variables.forEach(function(d) { 
    q.defer(FB.api, "/" + variable, , "GET", {fields: 'name,picture.type(large),engagement' }); 
}); 

q.await(function(error, response1, response2, response3) { 
    if (error) throw error; 
    // build out nodes from responses... 
}); 

Answer 3

異なるアプローチを待つと、いくつかの修正（聞かせて、矢印機能、...）： あなたはそうのようにそれを行うことができますキューのための

let variables = ['pageid1', 'pageid2', 'pageid3']; 
cosnt sendRequest = (variable) => { 
    return new Promise ((resolve, reject) => { 
     FB.api('/' + variable, {fields:'name,picture.type(large),engagement'}, (response) => { 
      if(!response.error) { 
       resolve(response); 
      } else { 
       reject(response.error); 
      } 
     }); 
    }); 
}; 

const getData = async() => { 
    let nodes = []; 
    for (let i = 0; i < variables.length; i++) { 
     let response = await sendRequest(variables[i]); 
     nodes.push(response); 
    } 
    console.log(nodes); 
}; 

getData();