对于在 if else 语句中不起作用的计数器变量答案

【问题标题】：For counter variable not working in the if else statement对于在 if else 语句中不起作用的计数器变量
【发布时间】：2018-03-22 13:16:06
【问题描述】：

for 计数器中的 i 变量在为每个 Twitch 流媒体获取每个 API 时有效，但是当我使用它生成 div 时，它只显示为 8。是在获取 API 数据并遍历流媒体时，有什么方法可以使计数器工作？

$(document).ready(function(){

// streamers I want to look up

 var streamers = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]

// counts the number of streamers in the array

  for (var i = 0; i < streamers.length; i++){

// gets each streamer, one by one

  $.getJSON("https://wind-bow.gomix.me/twitch-api/streams/" + streamers[i] +"?callback=?", function(json) {

//if they are not offline, pulls information from them and adds it to a div

if ((json.stream) !== null) {
  $("#results").prepend("<div class = \"resultsONLINE\">" + json.stream.channel.display_name + "</div>");

// if they are offline, marks them as offline

} else {
  $("#results").append("<div class = \"resultsOFFLINE\">" + streamers[i] + " is offline</div>");

}


  });

  };

【问题讨论】：

标签： javascript api for-loop if-statement

【解决方案1】：

试试这个

$(document).ready(function(){

    // streamers I want to look up

     var streamers = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]

    // counts the number of streamers in the array
      var index = 0;
      for (var i = 0; i < streamers.length; i++){

    // gets each streamer, one by one

      $.getJSON("https://wind-bow.gomix.me/twitch-api/streams/" + streamers[i] +"?callback=?", function(json) {

    //if they are not offline, pulls information from them and adds it to a div

    if ((json.stream) !== null) {
      $("#results").prepend("<div class = \"resultsONLINE\">" + json.stream.channel.display_name + "</div>");

    // if they are offline, marks them as offline

    } else {
      $("#results").append("<div class = \"resultsOFFLINE\">" + streamers[index] + " is offline</div>");

    }
    index++;


      });

      };

【讨论】：

成功了！这个真的很聪明很简单，以后完全会用到这个，谢谢大家的帮助！
等等，现在每次运行它都会给我不同的结果？！？有时说主播既在线又离线，有时说得对，但没有变化的变量，这怎么可能？

【解决方案2】：

如果我没记错的话，getJSON 是一个基于 promise 的函数，所以尝试使用 .then(json => function() ...)。

这段代码应该可以正常工作。

$(document).ready(function() {
  // streamers I want to look up
  var streamers = [
    "ESL_SC2",
    "OgamingSC2",
    "cretetion",
    "freecodecamp",
    "storbeck",
    "habathcx",
    "RobotCaleb",
    "noobs2ninjas"
  ];

  // counts the number of streamers in the array
  var streamerLength = streamers.length;
  for (var i = 0; i < streamerLength; i++) {
    // gets each streamer, one by one
    $.getJSON(
      "https://wind-bow.glitch.me/twitch-api/streams/" + streamers[i]
    ).then(json => appendStreamerInfo(json));
  }

  function appendStreamerInfo(json) {
    //if they are not offline, pulls information from them and adds it to a div
    if (json.stream !== null) {
      $("#results").prepend(
        '<div class = "resultsONLINE">' +
          json.stream.channel.display_name +
          "</div>"
      );

      // if they are offline, marks them as offline
    } else {
      $("#results").append(
        '<div class = "resultsOFFLINE">' + streamers[i] + " is offline</div>"
      );
    }
  }
});

【讨论】：