加载本地 json 文件并将结果分配给变量

Question

我在解析 json 文件时遇到问题，我现在不知道问题出在哪里，希望你能帮助我。

<script type="text/javascript">
var d;
$.getJSON("empl-estab.json", function (data) {
d=data;
});
console.log(d);
var chart = Highcharts.chart('container', {
title: {
                        text: 'Statistiques'
                    },
                    subtitle: {
                        text: 'Plan'
                    },
                    xAxis: {
                        categories: d.categories,
                    },
                    series: [{
                            type: 'column',
                            colorByPoint: true,
                            data: d.data,
                            showInLegend: false
                        }]

                });
</script>

the error is : d is undefined

Answer 1

将所有与 response 结果相关的代码放在 getJSON 的 callback 函数中。发生这种情况是因为外部的所有代码都在请求完成之前执行。因此 d 未定义。

var d;
$.getJSON("empl-estab.json", function (data) {
  d=data;
  console.log(d);
  var chart = Highcharts.chart('container', {
  title: {
        text: 'Statistiques'
    },
    subtitle: {
        text: 'Plan'
    },
    xAxis: {
        categories: d.categories,
    },
    series: [{
            type: 'column',
            colorByPoint: true,
            data: d.data,
            showInLegend: false
        }]

  });
});

Answer 2

这是由于 GET 请求的异步性质。您编写的代码在 GET 请求 returns 之前执行了 console.log 语句。您想将您的逻辑放在返回文档后执行的回调函数中。

Answer 3

此外，在 async function 中，变量可以毫无问题地等待下载：

async function load() {
    //The await keyword will make the d variable wait for the json file
    var d = await fetch('empl-estab.json').then(file => file.json());

    //Now your d variable is avaliable
    console.log(d);    
}
load();

加载本地 json 文件并将结果分配给变量

Loading local json file and assigning the result to a variable

javascript

parsing

json

getjson