為什么我不能將 Javascript ajax 響應存儲在全局變量中？

Question

我無法訪問存儲一些 ajax 響應數據的全局變量。 當我控制台記錄對象本身時，它會提供所有詳細信息，但是當我控制台記錄該對象中的數組時，它會返回我[] 。 我已將 ajax 請求設置為同步。

//let define some global valibables first
var urlun = "#";
var resultObject = {};
resultObject.logo = [];
resultObject.url = [];
resultObject.namee = [];
resultObject.statuss = [];
resultObject.append = appendContent;

var channelArr = ["freecodecamp", "storbeck", "sheevergaming", "habathcx", "RobotCaleb", "ESL_SC2", "ogamingsc2", "noobs2ninjas", "beohoff", "askjoshy", "ggnetworktv"];

//this function is to get all channel's info, those that are not streaming
function getAllnotStreaming(data) {
  var thisItemIsAppend = false;
  for (var i = 0; i < resultObject.namee.length; i++) {
    if (resultObject.namee[i] == data.display_name) {
      thisItemIsAppend = true;
    };
  } // end for
  //real thing
  if (thisItemIsAppend == false) {
    resultObject.logo.push(data.logo);
    resultObject.url.push(data.url);
    resultObject.namee.push(data.display_name);
    resultObject.statuss.push("offline");
  }
}

//get all streaming channle's info
function getAllnowStreaming(data) {
  if (data.stream) {
    resultObject.logo.push(data.stream.channel.logo);
    resultObject.url.push(data.stream.channel.url);
    resultObject.namee.push(data.stream.channel.display_name);
    resultObject.statuss.push(data.stream.channel.status);
  }
}

//to append channel to page, wheather it's streaming or not, all you need a one function
function appendContent(logo, url, name, status) {
  if (logo == null) {
    logo = "https://dummyimage.com/50x50/ecf0e7/5c5457.jpg&text=0x3F";
  };
  var statushtml = '<div class="row channels onlinenow"> <div class="col-md-2"><img class="logoimg" src="' + logo + '"></div> <div class="col-md-4"><div class="name"><a target="_blank" href="' + url + '">' + name + '</a></div></div> <div class="col-md-6"><div class="streaming">' + status + '</div></div></div>';
  $(statushtml).appendTo("#content");
}

//below are control buttons
function showOnlineOnly() {
  $(".offlinenow").show();
  $(".onlinenow").show();
  $(".offlinenow").hide();
}

function showOfflineOnly() {
  $(".offlinenow").show();
  $(".onlinenow").show();
  $(".onlinenow").hide();
}

function showAll() {
  $(".offlinenow").show();
  $(".onlinenow").show();
}

$(document).ready(function() {
  //regestor contol event
  $("#showOnlineOnly").click(showOnlineOnly);
  $("#showOfflineOnly").click(showOfflineOnly);
  $("#showAll").click(showAll);

  // get all now streaming channel first
  for (var i = 0; i < channelArr.length; i++) {
    var url = "https://api.twitch.tv/kraken/streams/" + channelArr[i] + "?callback=?";
    $.ajax({
      dataType: "json",
      async: false,
      url: url,
      success: getAllnowStreaming,
    });
  } //end of for loop

  // let's now get not steaming channels
  for (var i = 0; i < channelArr.length; i++) {
    var url = "https://api.twitch.tv/kraken/channels/" + channelArr[i] + "?callback=?";
    $.ajax({
      dataType: "json",
      async: false,
      url: url,
      success: getAllnotStreaming,
    });
  } //end of another for loop

  //let's append content
  console.log(resultObject);

  console.log(resultObject.logo);
  for (var ii = 0; ii < channelArr.length; ii++) {
    resultObject.append(resultObject.logo[ii], resultObject.url[ii], resultObject.namee[ii], resultObject.statuss[ii]);
  }

});

Answer 1

你等待 ajax 調用完成嗎？ 我會說那個時候對象是空的。 您可能應該在 getAllnowStreaming 和 getAllnotStreaming 中進行追加。