Probleme with variable scope on my TwitchTV challenge

Probleme with variable scope on my TwitchTV challenge
0.0 0

#1

Hi everyone,

here’s my code:

function notOnline(streamer){
      
    $.getJSON('https://wind-bow.gomix.me/twitch-api/streams/' + streamer + '?callback=?', function(data3){
      if(data3["stream"]===null){
        console.log(streamer+" est hors ligne!")
        horsLigne=horsLigne.push(streamer);
      }
      else{
        console.log(streamer+" est en ligne!")
      }
      
    });
       
    };
    notOnline("Blatty");

How can I have access to horsLigne variable to use it out of those functions?

thanks for your help


#2

You don’t want this. Do all of your processing and displaying from within getJSON's callback. You can write a function somewhere else and call it there if you want, but don’t count on manipulating variables outside of your function’s scope.


#3

Ok but if I do like you say, streamer[h] is undefined

function notOnline(streamer){
      for(var h=0;h<streamer.length;h++){
        $.getJSON('https://wind-bow.gomix.me/twitch-api/streams/' + streamer[h] + '?callback=?', function(data3){
          if(data3["stream"]===null){
          $('.emplacement').prepend("<div class='conteneur-3'><h1>"+streamer[h]+"est hors ligne</h1></div>")
          horsLigne=horsLigne.push(streamer);
          } 
        });
      };   
    };
    notOnline(twitchStreamers);

Where is my mistake ? thanks for your answer


#4

Your for loop finishes before any of your getJSON callbacks fire. Run this code to help you understand:

for(var h=0;h<streamer.length;h++){
        $.getJSON('https://wind-bow.gomix.me/twitch-api/streams/' + streamer[h] + '?callback=?', function(data3){
             console.log(h);
         }
}

You’re going to get the same number, and it will be streamer.length. The easiest way to fix this is to use let instead of var in your loop. If you haven’t learned about this yet, don’t worry. let means JavaScript will create a new variable for each loop. var reuses the same variable, which gets overwritten.

for(let i = 0; i < streamer.length; i++) {
    // do stuff
}

#5

You pass streamer into

Also, I assume horsLigne is a global array? If you are wanting to push the current streamer username into this array, then you will need to specify a specific element in streamer (using h as an index). Also, you do not need to assign horsLigne.push(streamer[h]) to horsLigne, because this code will actually return the length of the horsLigne after the push and then assign it to horsLigne during the first iteration of the for loop. Unfortunately, after this code runs, then horsLigne is no longer an array, but instead is a number, so all other attempts to push on subsequent iterations will fail, because it is not an array any more. You might want to review how to add elements to an array to refresh your memory. The correct code for adding an element to the horsLigne array is below, but check out the FCC challenge called Manipulate Arrays With push.

horsLigne.push(streamer[h]);

#6

It works, I’ve not fully understood what you said about let, but it works! I need to get more informations with this, thank you for your very fast answer ! you’re Supercodeman !

Just one last thing, according to your first answer, if I have a table variable, in this example it’s

    var twitchStreamers = ["ESL_CSGO_FR", "FroggedTV", "SUSSULEVRAI", "ZeroxMercy", "BeGeniusESC_TV", "Blatty", "dahmien7", "freecodecamp"];
    var horsLigne = [];

function notOnline(streamer){
      for(let h=0;h<streamer.length;h++){
        $.getJSON('https://wind-bow.gomix.me/twitch-api/streams/' + streamer[h] + '?callback=?', function(data3){
          if(data3["stream"]===null){
          $('.emplacement').prepend("<div class='conteneur-3'><h1>"+streamer[h]+"est hors ligne</h1></div>")
          horsLigne=horsLigne.push(streamer[h]);
          } 
        });
      };   
    };
    notOnline(twitchStreamers);

horsLigne is not modified and you said me that I must not use variable out of scope, that mean it’s not good to do this ? I juste want to have a table of names, passing it in a function which determine if players are online and returning me a table with only notOnline names, like a new variable I can access out of notOnline().


#7

Hello randel thanks for your answer I forgot to modify this it was my mistake. thanks


#8

Yes, don’t do this. It may seem like an easy way to keep track of the results, but when you’re working with AJAX requests like getJSON, things don’t always happen when you expect them to. We already saw this with the for loop - h was not the value you thought it would be because of the way JavaScript handles asynchronous requests.