从XMLHttpRequest函数

时间:2016-10-30 18:03:02

标签: javascript json xmlhttprequest return

您好我一直在试图从XMLHttpRequest函数返回数据。我尝试了很多不同的方法,但是当我尝试从外部输出数据到控制台时,我唯一能得到的就是我总是得到'未定义'。它只有在我从函数本身内部完成时才有效。

<script>
var object;

function loadJSON(path, success, error) {
    var xhr = new XMLHttpRequest();
    var obj1;
    xhr.onreadystatechange = function () {
        if (xhr.readyState === XMLHttpRequest.DONE) {
            if (xhr.status === 200) {
                if (success)
                success(JSON.parse(xhr.responseText));
                //console.log(data); works here!
            } else {
                if (error)
                error(xhr);
            }
        }
    };
    xhr.open("GET", path, true);
    xhr.send();
}


object = loadJSON('jconfig.json',
function (data) { console.log(data); return($data);/*works here! but does not return!*/ },
function (xhr) { console.error(xhr); }
);

console.log(object);//does not work here
</script>

我知道这是一个非常简单的问题,但我现在已经坚持了这个问题超过一个小时,而其他类似问题的答案似乎无法让我克服这个障碍。任何帮助都非常感谢!

编辑:我用一些建议更新了代码,但我仍然无法工作。获取上述代码的任何建议最终都会返回我可以在函数之外使用的东西。

1 个答案:

答案 0 :(得分:4)

在调用laodJSON()函数之后执行line console.log(object),直到那时才加载JSON对象。

这与回调和异步函数有关。你的loadJSON()只有在得到服务器的响应时才能真正加载JSON。

相反,如果要在loadJSON()函数之外调用JSON对象,则需要使用回调函数。像这样:

<script>
var object;

function loadJSON(path, callback) {
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function () {
        if (xhr.readyState === XMLHttpRequest.DONE) {
            if (xhr.status === 200) {
                // Here the callback gets implemented
                object = JSON.parse(xhr.responseText);
                callback();
            } else {

            }
        }
    };

    xhr.open("GET", path, true);
    xhr.send();
    return xhr.onreadystatechange();
}

loadJSON('jconfig.json', function printJSONObject(){
          console.log(object);
    });

// this will not work unless you get the response
console.log(object);

</script>

更新:&#34;返回&#34;使用回调从异步函数中获取的值是没有意义的,因为下一行代码将立即执行而无需等待响应。

相反,如果您想使用发送XHR请求的函数之外的对象,请实现回调函数中的所有内容。