如何从AJAX返回一个数组并存储在一个javascript变量中

Question

我想要'this.responseText'这是一个从这个函数返回的数组，并设置为'teacherIDList'，但我不知道如何。有帮助吗？

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        var teacherIDList = eval("(" + this.responseText+ ")");
    }
}

xmlhttp.open("GET", "getTeacherID.php?q=" + subjectID, true);
xmlhttp.send();     

Answer 1

您有几种方法可以这样做。

在函数外定义变量：

var teacherIDList;

function doXHR() {
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      teacherIDList = eval("(" + this.responseText+ ")");
    }
  }

但是，使用此方法，您无法知道何时完成XHR并填充teacherIDList。这可能是好的，这取决于你如何使用变量，但更好的方法是使用一个承诺：

使用承诺：

function doXHRPromise() {
  return new Promise(function(resolve, reject) {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        resolve(this.responseText);
      }
    }
  }
  ...
}

doXHRPromise.then(function(responseText) {
  var teacherIDList = eval("(" + this.responseText+ ")");
  // do whatever else you need to do here
});

这样，您可以确保在对其进行操作之前填充teacherIDList。

P.S。不要使用eval()，而是要打开自己的跨站点脚本攻击。

有关详细信息，请参阅此链接：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval