变量在 for 循环中没有改变 - JavaScript答案

【问题标题】：Variable isn't changing in for loop - JavaScript变量在 for 循环中没有改变 - JavaScript
【发布时间】：2016-04-13 04:27:11
【问题描述】：

为什么这会将每个 feedName 输出为相同的名称 (MedryBW)？我花了一段时间弄乱它，无法弄清楚。我希望它在循环的每次迭代中输出提要的名称，而不是一遍又一遍地重复同一个。谢谢大家。

var feeds = ["Towellie", "TrumpSC", "TeamSp00ky", "TwitchPlaysPokemon", "Widgitybear", "AriaBlarg", "TheMexicanRunner", "OPNerd", "rabbitbong", "Wingsofdeath", "MedryBW"];

$(document).ready(function(){
    for(x = 0; x < feeds.length; x++){
        var feedName = feeds[x];
        $.getJSON('https://api.twitch.tv/kraken/streams/' + feeds[x] + '?callback=?', function(data) {
            if(data.stream === null){
                $('#feeds').append("<p>" + feedName + " is offline </p>");
            } else {
                $('#feeds').append("<p>" + feedName + " is streaming "  (data.stream.game) + "/<p>");
            }
        });
    }
});

【问题讨论】：

标签： javascript variables for-loop scope

【解决方案1】：

因为回调函数运行的时间很晚，而不是在循环中，并且它只是在循环完成后获取变量值（最后一个值），所以使用bind函数将变量传递给函数

var feeds = ["Towellie", "TrumpSC", "TeamSp00ky", "TwitchPlaysPokemon", "Widgitybear", "AriaBlarg", "TheMexicanRunner", "OPNerd", "rabbitbong", "Wingsofdeath", "MedryBW"];

$(document).ready(function() {
    for(x = 0; x < feeds.length; x++){
        var feedName = feeds[x];
        $.getJSON('https://api.twitch.tv/kraken/streams/' + feeds[x] + '?callback=?', function(feedName, data) {
            if (data.stream === null) {
                $('#feeds').append("<p>" + feedName + " is offline </p>");
            }else{
                $('#feeds').append("<p>" + feedName + " is streaming " + (data.stream.game) + "/<p>");
            }
        }.bind(this, feedName));
    }
});

【讨论】：

【解决方案2】：

因为你已经在for循环中编写了ajax，所以成功回调在for循环执行后执行

var feeds = ["Towellie", "TrumpSC", "TeamSp00ky", "TwitchPlaysPokemon", "Widgitybear", "AriaBlarg", "TheMexicanRunner", "OPNerd", "rabbitbong", "Wingsofdeath", "MedryBW"];

$(document).ready(function() {
  feeds.forEach(function(feedName) {
    $.getJSON('https://api.twitch.tv/kraken/streams/' + feedName + '?callback=?', function(data) {
      if (data.stream === null) {
        $('#feeds').append("<p>" + feedName + " is offline </p>");
      } else {
        $('#feeds').append("<p>" + feedName + " is streaming " + (data.stream.game) + "/<p>");
      }
    });

  });
})

以上更改将起作用

【讨论】：

【解决方案3】：

您可以通过以下方式实现。

var feeds = ["Towellie", "TrumpSC", "TeamSp00ky", "TwitchPlaysPokemon", "Widgitybear", "AriaBlarg", "TheMexicanRunner", "OPNerd", "rabbitbong", "Wingsofdeath", "MedryBW"];

        $(document).ready(function(){
        var divText;
        for(x = 0; x < feeds.length; x++){
            var feedName = feeds[x];
            $.getJSON('https://api.twitch.tv/kraken/streams/' + feeds[x] + '?callback=?', function(data) {
          if(data.stream === null){
         divText = divText + '<p>'+feedName+' is offline </p>';
          }else{
         divText = divText + '<p>'+feedName+' is streaming '+(data.stream.game) +'</p>'
        }
        });
        }
     $('#feeds').append(divText); 
     //or $('#feeds').html(divText); 

        })

【讨论】：