与异步和同步函数相关的未定义JavaScript函数问题

目前我正在从twitch.tv API中检索数据的项目。我有两个功能 - 一个是分类用户是否处于活动状态，不活动或已经死亡（已经删除他们的账户），另一个是根据用户的状态获取特定数据。例如，如果在运行classification函数时发现user1处于活动状态，则使用profile函数我将检索他/她的个人资料图片和生物。我将profile函数返回的字符串值存储在add变量中，但console.log(add)显示为未定义。我的代码如下。任何解释或解决方案将非常感谢！我是Javascript的新手，所以简单的解释会很棒！与异步和同步函数相关的未定义JavaScript函数问题

$(document).ready(function(){ 
var users= ["freecodecamp", "storbeck", "terakilobyte", "habathcx","RobotCaleb","thomasballinger","noobs2ninjas","beohoff", "MedryBW", "comster404", "brunofin"]; 
classification(users); 

function classification(arr){ 
    for(var i=0; i<arr.length; i++) { 
     (function(i) { 
     $.getJSON("https://api.twitch.tv/kraken/streams/"+arr[i]+"?callback=?", function (data){ 
      var code=""; 
      if(data.stream) { 
       var add= profile(arr[i], data.stream); 

       code="<div id='"+arr[i]+"' class='active'><a href='http://www.twitch.tv/"+arr[i]+"'>"+arr[i]+"</a><img class='check-icon' src='css/images/check.png'>"+add+"</div>"; 

       //why is add undefined?? 
       console.log(add); 
       $("#content").append(code); 

      } else if (data.stream===null) { 
       var add= profile(arr[i], data.stream); 
       code="<div id='"+arr[i]+"' class='inactive'><a href='http://www.twitch.tv/"+arr[i]+"'>"+arr[i]+"</a><img class='x-icon' src='css/images/x.png'>"+add+"</div>"; 
       //why is add undefined?? 
       console.log(add); 
       $("#content").append(code); 

      } else if (data.error) { 
       code="<div id='"+arr[i]+"' class='dead'>Unfortunately "+arr[i]+" has deleted their account</div>"; 
       $("#content").append(code); 
      } 

     }); 
    })(i); 

    } 


} 


function profile(val, ifActive) { 
    var code=""; 
    $.getJSON("https://api.twitch.tv/kraken/users/"+val+"?callback=?", function (data){ 
     if(ifActive) { 
      var pic= data.logo; 
      var bio= data.bio; 
      code="<span class='pic'><img src='"+pic+"'></span><div class='bio'>"+bio+"</div>"; 


      return code; 

     } else if(ifActive===null) { 
      var pic= data.logo; 
      code="<span class='pic'><img src='"+pic+"'></span>"; 


      return code; 

     } 
    }); 


}

}）;

来源

2015-12-30 dshidham

回调这是因为您的配置文件功能不返回任何值。内部的Ajax调用会执行，但您需要做的是将返回的值返回到分类。 –

您无法从异步方法返回。你编码的方式，它不会工作。基本上所有的'var add = profile（arr [i]，data.stream）'后面的代码需要在配置文件回调中执行。 – epascarello

@epascarello有趣......我认为我的配置文件功能是一种同步方法。你怎么知道它是异步的？我在理解如何区分两者时遇到了一些麻烦，因此任何解释或有用的链接都将非常感谢！ – dshidham

实现您的个人资料功能

$(document).ready(function(){ 
    var users= ["freecodecamp", "storbeck", "terakilobyte", "habathcx","RobotCaleb","thomasballinger","noobs2ninjas","beohoff", "MedryBW", "comster404", "brunofin"]; 
    classification(users); 

    function classification(arr){ 
     for(var i=0; i<arr.length; i++) { 
      (function(i) { 
       $.getJSON("https://api.twitch.tv/kraken/streams/"+arr[i]+"?callback=?", function (data){ 
        var code=""; 
        if(data.stream) { 
         profile(arr[i], data.stream, function(add){ 
          code="<div id='"+arr[i]+"' class='active'><a href='http://www.twitch.tv/"+arr[i]+"'>"+arr[i]+"</a><img class='check-icon' src='css/images/check.png'>"+add+"</div>"; 

          //why is add undefined?? 
          console.log(add); 
          $("#content").append(code); 
         }); 


        } else if (data.stream===null) { 
         profile(arr[i], data.stream, function(add){ 
          code="<div id='"+arr[i]+"' class='inactive'><a href='http://www.twitch.tv/"+arr[i]+"'>"+arr[i]+"</a><img class='x-icon' src='css/images/x.png'>"+add+"</div>"; 
          //why is add undefined?? 
          console.log(add); 
          $("#content").append(code); 
         }); 

        } else if (data.error) { 
         code="<div id='"+arr[i]+"' class='dead'>Unfortunately "+arr[i]+" has deleted their account</div>"; 
         $("#content").append(code); 
        } 

       }); 
      })(i); 
     } 
    } 

    function profile(val, ifActive, callback) { 
     var code=""; 
     $.getJSON("https://api.twitch.tv/kraken/users/"+val+"?callback=?", function (data){ 
      if(ifActive) { 
       var pic= data.logo; 
       var bio= data.bio; 
       code="<span class='pic'><img src='"+pic+"'></span><div class='bio'>"+bio+"</div>"; 
       if(typeof callback == 'function') { 
        callback(code); 
       } 
      } else if(ifActive===null) { 
       var pic= data.logo; 
       code="<span class='pic'><img src='"+pic+"'></span>"; 
       if(typeof callback == 'function') { 
        callback(code); 
       } 
      } 
     }); 


    } 
});

来源

2015-12-30 04:11:09 dann

非常感谢！这工作！ – dshidham

与异步和同步函数相关的未定义JavaScript函数问题

回答

相关问题