Javascript 获取JSON文件的AJAX调用返回空值

我现在有一个函数，它通过AJAX调用检索JSON文件，并在控制台上打印出其内容。但是，我无法让它读取文件。我知道该位置的格式正确，但是

json

变量将始终返回

null

值，表示不存在文件

function loadSettings(){
    //loads setting list from mcc.json
    var options = (function() {
        var json = null;
        $.ajax({
            'async': false,
            'global': false,
            'url': "js/mcc.json",
            'dataType': "json",
            'success': function (data) {
                json = data;
            }
        });
        return json;
    })();
    console.log(options);
}

---

我的AJAX调用有什么问题吗？

AJAX本身就是一个异步调用，所以它是一个非阻塞代码，所以

return json
将立即返回（您将其分配为null），当响应从服务器返回一段时间后，将执行
success
回调，该回调仍然可以访问外部闭包中声明的变量（
json
）

相反，尝试返回一个承诺，并在数据进入
success
回调时解析该承诺。在promise的使用端，使用
然后使用
和回调函数，以在数据解析时获取数据

编辑

在编辑中，我正在编辑您的代码并添加到这个答案中，使用承诺并立即返回承诺，以便使用相同的模式

function loadSettings(){
    //loads setting list from mcc.json
    var options = (function() {
        var defer= $.Deferred(); // create a deferred-promise 
        $.ajax({
            'async': false,
            'global': false,
            'url': "js/mcc.json",
            'dataType': "json",
            'success': function (data) {
                defer.resolve(data);
            }
        });
        return defer.promise(); // return the deferred promise instead
    })();
    options.then(function(data){
        console.log(data);
    }); 
}

AJAX
本身就是一个异步调用，所以它是一个非阻塞代码，所以

return json
将立即返回（您将其分配为null），当响应从服务器返回一段时间后，将执行
success
回调，该回调仍然可以访问外部闭包中声明的变量（
json
）

相反，尝试返回一个承诺，并在数据进入
success
回调时解析该承诺。在promise的使用端，使用
然后使用
和回调函数，以在数据解析时获取数据

编辑

在编辑中，我正在编辑您的代码并添加到这个答案中，使用承诺并立即返回承诺，以便使用相同的模式

function loadSettings(){
    //loads setting list from mcc.json
    var options = (function() {
        var defer= $.Deferred(); // create a deferred-promise 
        $.ajax({
            'async': false,
            'global': false,
            'url': "js/mcc.json",
            'dataType': "json",
            'success': function (data) {
                defer.resolve(data);
            }
        });
        return defer.promise(); // return the deferred promise instead
    })();
    options.then(function(data){
        console.log(data);
    }); 
}

成功/完成回调仅在ajax调用完成时发生。因此，函数实际上没有返回任何内容（“returnJSON”）

在AJAX中，您需要获取数据对象，然后调用下一步应该运行的内容，因为任何成功或完整的回调函数都将在执行代码之后，当服务器返回响应时发生

基本上，您是在ajax调用完成之前返回json变量。
只有在ajax调用完成时，才会发生成功/完成回调。因此，函数实际上没有返回任何内容（“returnJSON”）

在AJAX中，您需要获取数据对象，然后调用下一步应该运行的内容，因为任何成功或完整的回调函数都将在执行代码之后，当服务器返回响应时发生

基本上，在ajax调用完成之前，您将返回json变量。
因为您将立即调用的函数返回的值分配给
选项，所以您应该牢记javascript不会停止执行或等待任何异步请求得到解决，因此您的IIFE将立即返回（在您的情况下，
json
设置为null）

如果您需要处理返回的数据，请在
success
回调中进行处理
因为您正在将立即调用的函数的返回值分配给
options
，所以您应该牢记javascript不会停止其执行或等待任何异步请求得到解决，因此您的IIFE将立即返回（在您的情况下，
json
设置为null）

如果您需要处理返回的数据，请在
success
callback
中执行。当您返回JSON数据时，AJAX调用尚未完成。有人提到使用promise，但下面显示了另一种方法。此方法在AJAX完成后调用doTheNextThing函数。请在该新函数中处理您的设置

function loadSettings(){
    var options = (function() {
        $.ajax({
            'async': false,
            'global': false,
            'url': "js/mcc.json",
            'dataType': "json",
            'success': function (data) {                
                doTheNextThing(data);
            }
        });           
    })();
}
//------------------------------------------
function doTheNextThing(data)
{
    //Now process your load settings here
}

当您返回JSON数据时，AJAX调用尚未完成。有人提到使用承诺，但下面显示了替代方法。这将在AJAX完成后调用doTheNextThing函数。在该新函数中处理您的设置

function loadSettings(){
    var options = (function() {
        $.ajax({
            'async': false,
            'global': false,
            'url': "js/mcc.json",
            'dataType': "json",
            'success': function (data) {                
                doTheNextThing(data);
            }
        });           
    })();
}
//------------------------------------------
function doTheNextThing(data)
{
    //Now process your load settings here
}

如果您要从文件系统获取它，为什么不使用ES6
import
和
export
？因为AJAX是异步的，尽管您有属性async，它只在服务器中有多个AJAX调用时才执行异步。AJAX调用完成后，上述代码将立即返回json。如果您正在获取它，则可能会重复在您的文件系统中，为什么不使用ES6
import
和
export
？因为AJAX是异步的，尽管您有属性async，它只在服务器中有多个AJAX调用时才执行异步。AJAX调用完成后，上面的代码将立即返回json。AJAX调用可能会重复，那么AJAX调用应该是什么样子呢了解发生了什么，但我不确定如何正确格式化。有几种方法，但我更喜欢的是重新构造代码。创建一个名为mycallback（）的函数；ajax函数成功/完成后调用名为mycallback（）的函数；。查看这篇文章帮助的链接。我能够重新生成我的函数来调用另一个回调函数。那么AJAX调用应该是什么样子呢？我知道发生了什么，但我不确定如何正确格式化。有几种方法，但我更喜欢的是重新构造代码。创建一个名为mycallback（）的函数，当ajax函数调用成功/完成时调用名为mycallback（）的函数；。请查看这篇文章提供帮助的链接。我能够重新生成函数以调用另一个回调函数。