我如何读取Json文件并在数组中存储一些数据,然后在读取文件后访问它

how do I read a Json File and store some data in an array and then later after reading the file access it?

本文关键字:文件 读取 数据 然后 访问 存储 何读取 Json 数组      更新时间:2023-09-26

如下面的代码所示,我试图读取Json文件并将Json文件中的一些值推入数组,如果在函数内访问该数组,则该值被正确存储

但是当回调函数结束时,数组为空为什么数组不包含推入的值?

var latArray = new Array();
var longArray = new Array();
var getLatLong = d3.json("./SRC/ratp_2013.json", function (error, data){

        for(i in data.stops)
        {
            longArray.push(data.stops[i].longitude);
            latArray.push(data.stops[i].latitude);
        }
        console.log(longArray); //Prints the Array of latitudes
        console.log(latArray);  //Prints the Array of longitudes
});
console.log(longArray); //Prints an empty array.
console.log(latArray);  //Prints an empty array.

这肯定是一个异步调用。

您的控制台是否先打印空数组,然后再打印填充的数组?

如果它是一个异步调用,也应该有一个'onDataLoaded'事件。

发生这种情况是因为调用的异步性质。程序的执行将不会等待响应,并从下一行开始执行。您可以在链接中找到更多详细信息:D3 API

因此,在这种情况下,您可以使用以下任何一个选项来获得所需的结果:

  • 在回调函数中编写代码

  • 使用功能链(即在获得响应后可以进行呼叫)

这与执行时间有关。

JSON调用是异步的。这意味着浏览器不会等待它。

你的执行路径看起来像这样:

  • 定义数组
  • 调用JSON
  • console.log数组
  • 接收JSON
  • 将信息放入数组

试试这个:

var latArray = new Array();
var longArray = new Array();
var getLatLong = d3.json("./SRC/ratp_2013.json", function (error, data){

        for(i in data.stops)
        {
            longArray.push(data.stops[i].longitude);
            latArray.push(data.stops[i].latitude);
        }
        logArrays();
});
function logArrays() {
   console.log(longArray); //Prints an empty array.
   console.log(latArray);  //Prints an empty array.
}

执行路径为:

  • 定义数组
  • 调用JSON
  • 接收JSON
  • 将信息放入数组
  • 呼叫记录功能
  • console.log数组

因为:

console.log(longArray); //Prints an empty array.
console.log(latArray);  //Prints an empty array.

之前运行
var getLatLong = d3.json("./SRC/ratp_2013.json", function (error, data){
    for(i in data.stops)
    {
        longArray.push(data.stops[i].longitude);
        latArray.push(data.stops[i].latitude);
    }
    console.log(longArray); //Prints the Array of latitudes
    console.log(latArray);  //Prints the Array of longitudes
});

传递给d3的函数。Json是异步执行的

如果你像这样重写它,它应该可以工作:

function logResult() {
  console.log(longArray);
  console.log(latArray);
}
var getLatLong = d3.json("./SRC/ratp_2013.json", function (error, data){
    for(i in data.stops)
    {
        longArray.push(data.stops[i].longitude);
        latArray.push(data.stops[i].latitude);
    }
    logResult()
});

我猜d3.json是一个异步函数。

这意味着一旦您的d3.json函数启动,console.log函数也会启动。他们都是并排射击的。

因此,当文件被读取时,您正在调用这些console.log s。

您可以:

  1. 使用回调内部的数据
  2. 创建Promise (ES6)…
var d3Action = new Promise(function(resolve, reject){
  var latArray = [],
      longArray = [],
      getLatLong = d3.json("./SRC/ratp_2013.json", function (error, data){
        for(i in data.stops) {
          longArray.push(data.stops[i].longitude);
          latArray.push(data.stops[i].latitude);
        }
        resolve(longArray, latArray);
      });
});
d3Action.then(function(longArray, latArray){
  console.log(longArray, latArray)
})