javascript中json的循环问题

javascript中json的循环问题,javascript,json,loops,Javascript,Json,Loops,我想知道底部循环的问题是什么,或者当我试图将最后一个json登录到控制台时,是否遇到了错误。数组位于给定代码之上,前两个循环工作正常。我正在努力找回进球,但现实是我想找到一个有效的方法来找回所有的数据 d3.json('https://statsapi.web.nhl.com/api/v1/teams', function(data) { for (i=0; i < 31; i++) { teamID.push(data.teams[i].id);

我想知道底部循环的问题是什么,或者当我试图将最后一个json登录到控制台时,是否遇到了错误。数组位于给定代码之上,前两个循环工作正常。我正在努力找回进球,但现实是我想找到一个有效的方法来找回所有的数据

     d3.json('https://statsapi.web.nhl.com/api/v1/teams', function(data) {
      for (i=0; i < 31; i++) {
          teamID.push(data.teams[i].id);
      }
  });

  console.log(teamID);

  // request roster json data from API and loop through roster to get all player IDS
  // and append them to the playerList array

  d3.json('https://statsapi.web.nhl.com/api/v1/teams/1/?expand=team.roster', function(data) {
      for (i=0; i < data.teams[0].roster.roster.length; i++) {
        playerList.push(data.teams[0].roster.roster[i].person.id);
      }
  });

  console.log(playerList);

  // request player stat json data from API and loop through all players to get all stat
  // and append them to an array

  var playerStats = [];

    for (i = 0; i < playerList.length; i++) {
        d3.json('https://statsapi.web.nhl.com/api/v1/people/' + playerList[i] + '/stats/?stats=statsSingleSeason&season=20172018', function(data) {
          console.log(data.stats[0].splits[0].stat.goals);
        });

  //      console.log(playerStats);
      };

您的最后一个循环可能试图在从API返回HTTP调用的同时初始化/运行。由于您使用回调来获取详细信息,而不是承诺,因此您需要以回调形式进行此操作。以下是在没有您实际向我展示完整代码的情况下我能做的最好的事情:

d3.json'https://statsapi.web.nhl.com/api/v1/teams,函数组响应{ var teamIds=teamResponse.teams.filterteam,i=>i<31 .mapteam=>team.id; //我使用上面的函数方法,因为我认为它比循环更干净。 //对于i=0;i<31;i++{ //teamID.pushdata.teams[i].id; //} d3.json'https://statsapi.web.nhl.com/api/v1/teams/1/?expand=team.roster,函数罗斯特响应{ var playerIdList=rosterResponse.teams[0].花名册 .maptoster=>floster.person.id; //将其替换为上面的函数方法。 //对于i=0;i 我假设,当您需要支持较旧的浏览器时,您可以将babel与webpack一起使用,或者知道如何编写ES5

d3.json返回一个承诺,因此您可以省略回调并使用承诺:

Promise.all([
  d3.json('https://statsapi.web.nhl.com/api/v1/teams'),
  d3.json('https://statsapi.web.nhl.com/api/v1/teams/1/?expand=team.roster')  
])
.then(
  ([teams,playerData])=>{
    const playerList = playerData.teams[0].roster.roster.map(
      player=>player.id
    );
    return Promise.all(
      playerList.map(
        playerID=>
          d3.json(`https://statsapi.web.nhl.com/api/v1/people/${playerID}/stats/?stats=statsSingleSeason&season=20172018`)
      )
    ).then(
      (playerStats)=>[teams,playerData,playerStats]
    )
  }
)
.then(
  ([teams,playerData,playerStats])=>{
    console.log("teams:",teams);
    console.log("playerData:",playerData);
    console.log("playerStats:",playerStats);
  }
)
.catch(
  err=>console.warn("Something went wrong:",err)
);

我没有评论代码是如何工作的,所以如果您有关于代码的具体问题,请告诉我。如果你不知道为什么要使用承诺,我建议你读一读。和google mdn promise all,然后再询问promise all的作用。

您似乎试图在数据存在之前对其进行循环。如果我在请求下移动循环,则不会定义playerList[i],尽管=>我发布了答案。我不能100%确定它是否正确,但这是您可能能够做到的最好的方法,除非您使用一些Promise库来发出HTTP请求,我之所以不建议使用这种方法,唯一的原因是Promise对象在所有浏览器中都不完全支持,尤其是在IE的旧版本中,这就是为什么我要用下面的方式编写代码。现在,如果您不必支持旧浏览器,这是正确的答案。@th3n3wguy我认为最好使用标准promise语法,并尝试将Internet Explorer需要支持的内容聚合起来。我会在回答中添加一个警告,但假设大多数人现在都知道构建工具和polyfil。我同意,但我展示了一种方法,可以不用担心跨浏览器实现/polyfill,以防将来有人遇到这种情况