JavaScript 范围/代码迭代不同步

Question

我正在尝试创建一个工具来从网页上抓取信息(是的，我有权限)。

到目前为止，我一直在使用 Node.js 结合 requests 和 Cheerio 来拉取页面，然后根据 CSS 选择器查找信息。我已经做了足够的调试，知道脚本肯定成功地从页面获取了信息。

似乎发生的情况是，for 循环之后的代码首先执行，或者可能在调用之后执行得太快，并且请求无法完成。我不完全确定 JS 调用堆栈是如何工作的。

我的源代码如下:

var baseURL = 'http://www2.dailyfaceoff.com/teams/lines/';
var request = require('request'), 
    cheerio = require('cheerio'),
    urls = [],
    teams = [];


var teamPages = [13, 14, 15, 16, 17, 18, 19, 20, 21,
 21, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 
 35, 36, 37, 38, 39, 40, 41, 42]

 for(i in teamPages)
 {
    url = baseURL + teamPages[i];
    urls.push(url);
 }

 for(u in urls)
 {
    var team  = [];
    request(urls[u], function(err, resp, body)
      {
        if(!err && resp.statusCode == 200){
            var $ = cheerio.load(body);         
            var teamName = $('#newTitle').text();
            var players = [];
            $('#forwards td a img').each(function(){
                var name = $(this).attr("alt");
                players.push(name); });
            $('#defense td a img').each(function(){
                var name = $(this).attr("alt");
                players.push(name); });
            $('#goalie_list td a img').each(function(){
                var name = $(this).attr("alt");
                players.push(name); });
            //console.log(players);
            teams.push(players);    
        }
      });
 }
 console.log(teams);
 console.log('DONE');

Answer 1

有些事情看起来很奇怪，Node.js 是基于事件驱动的非阻塞模型。因此，在异步调用中使用像 for 这样的循环 block 时需要小心。尝试使用 forEach 并给它一个函数处理程序。此外，仅当您确定所有请求均已得到满足时才打印结果。下面的代码可能对您有帮助，但它仍然不是 100% 正确/漂亮:

urls.forEach( function (url, index) {
  var team  = [];
  request(u, function(err, resp, body)
  {
     if(!err && resp.statusCode == 200){
        .
        .
        teams.push(players);

        // Print the teams when last response is done
        if ( index == urls.length - 1 )
          console.log(teams);
     }
  });
}