Question

以下函数从文件读取JSON数据。

function getJsonData(){

  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function (){
   if(xhttp.readyState == 4 && xhttp.status == 200){
    var javaobj = JSON.parse(xhttp.response);
    return javaobj;
   }
  }

  xhttp.open("GET", "json_output.json", true)
  xhttp.send();
}

在下面调用getJsonData时，它返回undefined

function CreateTableFromJSON() { 
  var myBooks = getJsonData();
  alert(myBooks)//returns undefined
}

Answer 1

function getJsonData(cb) {

  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function () {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      var javaobj = JSON.parse(xhttp.response);
      cb(javaobj);
    }
  }
  xhttp.open("GET", "json_output.json", true)
  xhttp.send();

}

function CreateTableFromJSON() {

  getJsonData(function(myBooks){
    alert(myBooks)
  });

}

您可以使用javascript回调

function getJsonData() {
  return new Promise(resolve => {
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function () {
      if (xhttp.readyState == 4 && xhttp.status == 200) {
        var javaobj = JSON.parse(xhttp.response);
        resolve(javaobj);
      }
    }
    xhttp.open("GET", "json_output.json", true)
    xhttp.send();
  })


}

async function CreateTableFromJSON() {

  var myBooks = await getJsonData();
  alert(myBooks)

}

或者您可以使用Promise / async / await

function getJsonData() {
  return new Promise(resolve => {
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function () {
      if (xhttp.readyState == 4 && xhttp.status == 200) {
        var javaobj = JSON.parse(xhttp.response);
        resolve(javaobj);
      }
    }
    xhttp.open("GET", "json_output.json", true)
    xhttp.send();
  })
}

function CreateTableFromJSON() {
  getJsonData().then(myBooks => alert(myBooks))
}

或者，我们可以将then用于Promise

从javascript函数返回json数据

1 个答案: