处理异步代码以组合多个返回的响应

时间:2016-12-23 21:43:04

标签: javascript jquery callback promise

我正在研究一些查询github API的异步代码。我正在进行的每个API调用都会运行此代码,然后点击'weeksOfYear'控制台日志。我想要做的是将所有这些api调用捆绑到一个大数组中,这样我就可以将所有数据一起处理。我相信这会涉及回调,但我不知道该把它放到哪里。我在下面提供了我的代码。

我相信它会以这种方式回归,因为它完全属于一个承诺。当我尝试向代码添加另一个承诺时,我收到一个错误,上面写着'那么是未定义的'。这是因为我需要返回一个promise对象。所以,我认为解决方案是使用回调。

谢谢!

$.ajax({
  method: 'GET',
  url: 'https://api.github.com/orgs/lodash/repos' ,
  contentType: 'application/json',
  beforeSend: function(xhr){
      return xhr.setRequestHeader("Authorization", "token adbfde986475bbee66b2e22b4375be4d34adc098")
    }
})
.then(function (data){
  // console.log('GOT THIS DATA', data);
  return data.map(function(val){
      return val.name;
    });
})
.then(function (newData){
  newData.forEach(function(repoName){
    pagination(repoName, function(storage) {
      storage = storage.filter(function(PR){
        if(PR.merged_at !== null){
          return true;
           }
        })
        var weeksOfYear = {};
        console.log('STORAGE HERE IS', storage);
        storage.filter(function(mergedPR){
          if (moment(mergedPR.merged_at).year() === 2016){
            return true;
          }
        }).forEach(function(mergedPR){
          var weekMerged = moment(mergedPR.merged_at).week();
            if(!weeksOfYear[weekMerged]){
              weeksOfYear[weekMerged] = 1;
              // weeksOfYear[yearMerged] = yearMerged
            }else{
              weeksOfYear[weekMerged] += 1;
              // weeksOfYear[moment(mergedPR.merged_at).year()] = moment(mergedPR.merged_at).year()
            }
          })
          console.log('weeks of Year are', weeksOfYear)
        })
      })
    })

这就是分页的样子:

var pagination = function (repoName, callback) {
      var num = 1;
      var storage = [];
      function recursiveHelper(repoName, num){
         $.ajax({
        method: 'GET',
        url: 'https://api.github.com/repos/lodash/' + repoName + '/pulls?state=closed&page=' + num,
        contentType: 'application/json',
        beforeSend: function(xhr){
          return xhr.setRequestHeader("Authorization", "token adbfde986475bbee66b2e22b4375be4d34adc098")
        }
      })
      .then(function(numPullRequests){
        // console.log('numPullRequests', numPullRequests);
        storage = storage.concat(numPullRequests);
        if(numPullRequests.length !== 30){
          return callback(storage);
        }

        recursiveHelper(repoName, num + 1);
      })
        // console.log('this value is', numPullRequests);
      }

      recursiveHelper(repoName, num)

}

1 个答案:

答案 0 :(得分:0)

好的,因为分页是异步的,并且不会返回一个promise(即使它使用了promises!但它的递归本质使它成为现实)对现有代码的最小改变产生了这个

...
.then(function(newData) {
    // use Array#map and Promise.all ...
    return Promise.all(newData.map(function(repoName) {
        // create a Promise
        return new Promise(function(resolve, reject) {
            pagination(repoName, function(storage) {
                storage = storage.filter(function(PR) {
                    if (PR.merged_at !== null) {
                        return true;
                    }
                })
                var weeksOfYear = {};
                console.log('STORAGE HERE IS', storage);
                storage.filter(function(mergedPR) {
                    if (moment(mergedPR.merged_at).year() === 2016) {
                        return true;
                    }
                }).forEach(function(mergedPR) {
                    var weekMerged = moment(mergedPR.merged_at).week();
                    if (!weeksOfYear[weekMerged]) {
                        weeksOfYear[weekMerged] = 1;
                        // weeksOfYear[yearMerged] = yearMerged
                    } else {
                        weeksOfYear[weekMerged] += 1;
                        // weeksOfYear[moment(mergedPR.merged_at).year()] = moment(mergedPR.merged_at).year()
                    }
                });
                console.log('weeks of Year are', weeksOfYear);
                // resolve the promise in the callback
                resolve(weeksOfYear);
            });
        });
    }));
}).then(function(result) {
    // results is an array of weeksOfYear
});
  

但是,如果您更改pagination以返回承诺,例如

var pagination = function(repoName) {
    var num = 1;
    var storage = [];
    function recursiveHelper(repoName, num) {
        return $.ajax({
            method: 'GET',
            url: 'https://api.github.com/repos/lodash/' + repoName + '/pulls?state=closed&page=' + num,
            contentType: 'application/json',
            beforeSend: function(xhr) {
                return xhr.setRequestHeader("Authorization", "token adbfde986475bbee66b2e22b4375be4d34adc098")
            }
        })
        .then(function(numPullRequests) {
            // console.log('numPullRequests', numPullRequests);
            storage = storage.concat(numPullRequests);
            if (numPullRequests.length !== 30) {
                return storage;
            }
            return recursiveHelper(repoName, num + 1);
        });
        // console.log('this value is', numPullRequests);
    }
    return recursiveHelper(repoName, num);
};

您的代码可以更改为

...
.then(function(newData) {
    // again, use Array#map and Promise.all
    return Promise.all(newData.map(function(repoName) {
        // no need for new Promise as pagination returns a promise
        return pagination(repoName)
        .then(function(storage) {
            storage = storage.filter(function(PR) {
                if (PR.merged_at !== null) {
                    return true;
                }
            })
            var weeksOfYear = {};
            console.log('STORAGE HERE IS', storage);
            storage.filter(function(mergedPR) {
                if (moment(mergedPR.merged_at).year() === 2016) {
                    return true;
                }
            }).forEach(function(mergedPR) {
                var weekMerged = moment(mergedPR.merged_at).week();
                if (!weeksOfYear[weekMerged]) {
                    weeksOfYear[weekMerged] = 1;
                    // weeksOfYear[yearMerged] = yearMerged
                } else {
                    weeksOfYear[weekMerged] += 1;
                    // weeksOfYear[moment(mergedPR.merged_at).year()] = moment(mergedPR.merged_at).year()
                }
            });
            console.log('weeks of Year are', weeksOfYear);
            // just return weeksOfYear
            return weeksOfYear;
        });
    }));
}).then(function(result) {
    // results is an array of weeksOfYear
});
  

注意:如果您没有Promise可用

替换

return Promise.all(newData.map(function(repoName) {

return $.when.apply($, newData.map(function(repoName) {

}).then(function(result) {
    // results is an array of weeksOfYear
});

}).then(function() {
    // arguments will be weeksOfYear
});

对于第一个答案,您还需要更改

 return new Promise(function(resolve, reject) {
    pagination(repoName, function(storage) {
        //... snip
        console.log('weeks of Year are', weeksOfYear);
        // resolve the promise in the callback
        resolve(weeksOfYear);
    });
 });

var d = $.Deffered();
pagination(repoName, function(storage) {
     //... snip
     console.log('weeks of Year are', weeksOfYear);
     // resolve the promise in the callback
     d.resolve(weeksOfYear);
});
return d.promise();