Javascript/Json 请求对象返回 null

Question

我正在尝试使用 JS 访问本地 JSON 文件，通过解析它并将其记录到控制台将其转换为 JS 对象。我在 VS Code 中使用 Live Server 来设置服务器，因此使用本地主机 URL。

    var requestURL = "http://localhost:5500/sqVol.json";
    var request = new XMLHttpRequest();

    request.open('GET', requestURL);
    request.responseType = 'json';
    request.send();

    var jsonObj = request.response;
    request.onload = function () {
    JSON.parse(jsonObj);
    logData(jsonObj);
    };

    function logData(jsonObj){
      console.log("jsonObj= " + jsonObj);
      //console.log("jsonObj[Datum]= " + jsonObj[Datum]);
      //console.log("jsonObj.Datum= " + jsonObj.Datum);
    }

Output: jsonObj= null

JSON 文件:

  {
    "Datum": ["03.05.2017","05.06.2017"],
    "Volume": [1338,1445]
  }

这是我想象的情况:我从 localhost 获取答案，并通过 JSON.parse 将其解析为 JS 对象。请求完成后，我立即调用我的 logData 函数并传递解析后的数据来记录它。

Answer 1

正如 @connexo 指出的那样，我不理解调用的异步性质。坦率地说，我仍然不知道，但我想一个好的起点是:

How do I return the response from an asynchronous call?

MDN Synchronous and Asynchronous Requests

正如 @Mani Kumar Reddy Kancharla 指出的那样，自从我声明 request.responseType = 'json';

以来，我的响应已经是一个 JS 对象了

这就是现在的样子:

var requestURL = "http://localhost:5500/sqVol.json";
var request = new XMLHttpRequest();

request.open('GET', requestURL);
request.responseType = 'json';
request.send();

request.onload = function () {
console.log(request.response);
var jsonObj = request.response;
logData(jsonObj);
};

function logData(jsonObj){
  console.log("jsonObj= " + jsonObj);
  console.log("jsonObj[Datum]= " + jsonObj.Datum);

Ouput: {…} ​ Datum: Array [ "03.05.2017", "05.06.2017" ] ​ Volume: Array [ 1338, 1445 ] ​

jsonObj= [object Object]
jsonObj[Datum]= 03.05.2017,05.06.2017

如您所见，我还可以访问.Datum属性。我认为它已经解决了。谢谢!

编辑:添加了 connexo 提供的链接。