javascript - 为什么 return 在 getJSON 中不起作用以及为什么我不能从 getJSON 写入变量？

Question

我有一个使用 getJSON 的函数，但它没有像我预期的那样工作。

function balbla(name, param) {
        $.getJSON("/blabla.json?name=" + name + "&param=" + param, function(data) {
                return data.bla;
        });
}

当我在 getJSON 方法中使用 alert(data.bla) 时，它可以工作，但当我尝试 return data.bla 时，它不起作用。此外，当我创建一个变量并尝试将 data.bla 的值写入其中时，它根本不起作用!

//我试过这个:

function getRouteData(name, param) {
    return $.getJSON('/routes_js.json', {route:name, opt: param});
}
function getRoute(name, param) {
        getRouteData(name, param).done(function(data) {
                return data.route;
        });
}

但是当我调用 getRoute("bla", "blub") 时，它仍然返回 undefined。

Answer 1

AJAX 是异步的。您无法轻松地在此类函数中返回依赖于 AJAX 调用结果的值。更改您的函数以接受回调:

function balbla(name, param, cb) {
    $.getJSON('/blabla.json', {name:name, param: param}, function(data) {
        cb(data.bla);
    });
}

并像这样使用它:

balbla('foo', 'bar', function(bla) {
    // do stuff
});

更简洁的方法是返回 jqXHR 对象:

function balbla(name, param) {
    return $.getJSON('/blabla.json', {name:name, param: param});
}

调用时，使用 jqXHR 对象的 deferred/promise 接口(interface)附加成功回调:

balbla('foo', 'bar').done(function(data) {
    alert(data.bla);
});

请注意，在同步模式下使用 $.ajax() 根本不是您应该考虑的选项。它可能会挂起浏览器的 UI(或至少是事件选项卡)，直到请求完成。除此之外，异步回调是每个人都采用的方式。

如果您不喜欢使用回调函数，您可以使用预处理器，例如 tamejs自动生成异步函数。