Forループでの非同期フェッチ - 結果（終了）変数へのアクセス

Question

私はJS非同期で新しく、以下に関する質問があります。すべてのクエリが完了した場合にのみ作成された配列で作業を開始する方法。 forループでページを取得します。あなたはallOrgReposDataアレイがループ用に作成されて見ることができるように

var allOrgReposData = []; 
 
var repoContributorsUrls = []; 
 
for (var i=1; i <= orgPageIterations; i++) { 
 
    var orgReposUrl = 'https://api.github.com/orgs/angular/repos?page='+i; 
 
    fetch(orgReposUrl) 
 
    .then(response => response.json()) 
 
    .then(orgReposData => { 
 
    allOrgReposData = allOrgReposData.concat(orgReposData); 
 
    console.log(allOrgReposData); 
 
    }) 
 
}

が、私はこの配列に何かをしようとした場合、スクリプトはので、私の操作を反復ごとにそれを実行します。それは私のコードですexapmle（ページ上の30個の項目）の実行に代わり、複数回実行されます。 60; 90; 120; 150;代わりに171 = 621 171.

終了フェッチを待つことができ、これを使わないで配列にアクセスできますか？ "乗算"？

おはようございます！

Answer 1

あなたはすべての約束が完了するまで待ちますどのPromise.allを使用することができます。

var allOrgReposData = []; 
 
var repoContributorsUrls = []; 
 

 
var promises = []; 
 
let orgPageIterations = 1; 
 

 
for (var i = 1; i <= orgPageIterations; i++) { 
 
    let orgReposUrl = 'https://api.github.com/orgs/angular/repos?page=' + i; 
 
    promises.push(fetch(orgReposUrl).then(response => response.json())); 
 
} 
 

 
Promise.all(promises) 
 
    .then(data => { 
 
    allOrgReposData = data; 
 
    console.log(allOrgReposData); 
 
    }) 
 
    .catch(err => console.error(err));

var orgReposUrlをlet orgReposUrlに変更してブロックスコープを作成しています。

Answer 2

あなたは変数でやった呼の数を追跡することができます：

var allOrgReposData = []; 
var repoContributorsUrls = []; 
var callSuccess = 1; //Variable keeping track of your ajax calls 
for (var i=1; i <= orgPageIterations; i++) { 
    var orgReposUrl = 'https://api.github.com/orgs/angular/repos?page='+i; 
    fetch(orgReposUrl) 
    .then(response => response.json()) 
    .then(orgReposData => { 
    allOrgReposData = allOrgReposData.concat(orgReposData); 
    console.log(allOrgReposData); 
    callSuccess++; //Increment your var for each call 

    if(callSuccess == orgPageIterations){ //If every call has already been made, then continue 
     //DO YOUR THING HERE 
    } 
    }) 
} 

が