Does pushing Json/ajax information into an array create an object?

Question

Having a issue with this twitch app, if you check the console it logs an empty array, but then the array contains objects with the right information. I log typeof on the array and it displays object. I'm so confused I was trying to push the names into an array so I could use them in the for loop that followed.

$(document).ready(() => {

  let followerNames = [];

    $.ajax({
    type: 'GET',
    asynx: false,
    url: "https://api.twitch.tv/kraken/users/SCKADOOSH/follows/channels",
    headers: {
       'Client-ID': 'drj8nyih5rn8z2go1x0fgga6dmudwx'
    },
    success: (data2) => {

        for (var i = 0; i < data2.follows.length; i++) {  //check number of folowers user has
          const usersCurrentFollowers = data2.follows[i]; //check the array and get the channel names of followers
          followerNames.push(usersCurrentFollowers.channel.display_name); //push that channel name into an array of user's followers
        }
    }
  });

  console.log(followerNames);



    for (var j = 0; j < followerNames.length; j++) { //iterate over the array of follower names
        $.ajax({
        type: 'GET',
        url:  'https://api.twitch.tv/kraken/streams/'+followerNames[j],
        headers: {
         'Client-ID': 'drj8nyih5rn8z2go1x0fgga6dmudwx'
        },
        success: (data) => {  
            // console.log(data);

            let streamStatus = data.stream; //status of the users stream offline/online
            // console.log(channelUrl);

            if (streamStatus === null) { //check if streaming or not....if not streaming
            const offlineChannelLogo = "https://upload.wikimedia.org/wikipedia/commons/thumb/1/17/User-offline.svg/1024px-User-offline.svg.png"; //placeholder logo for offline streamer
            $("#status").append("<h3> Offline </h3>") //set status to offline
            $("#logo").append("<img class='streamerLogo' src='" + offlineChannelLogo + "'/>"); //logo to placeholder logo
            $("#streamerName").append("<h3>User Offline</h3>"); //set current stream/game to 'User Offline'

        } else { //if currently online streaming
            const channelLogo = data.stream.channel.logo; //get channel logo
            const streamerName = data.stream.channel.display_name; //get streamer name
      const streamLink = "https://www.twitch.tv/"+streamerName; //get link to streamers schannel
            $("#status").append("<h3><a href=" + streamLink +">" + streamStatus.game + "</a></h3>") //display game currently streaming on channel
            $("#logo").append("<img class='streamerLogo' src='" + channelLogo + "'/>"); //display channel logo
            $("#streamerName").append("<h3>"+ streamerName+"</h3>"); //display streamer name
        }
    }
    });
   }
});

You can't eat a pizza before it is delivered. Ajax is asynchronous — charlietfl, Jan 21 '17 at 12:45

score 0 · Answer 1 · edited May 23 '17 at 10:29

0

Arrays are objects. Almost everything is. More on that here.

As for the console.log(), you log after you've made the ajax request, not after the result has come, that's why you get an empty array - because there is no data yet. You should put the log inside the success callback in order to log the data.

edited May 23 '17 at 10:29

Community

1
1

answered Jan 21 '17 at 12:45

dodov

5,206
3
34
65

Does pushing Json/ajax information into an array create an object?

1 Answers1