javascript - Ajax 回调。不明白ajax回调

Question

我正在从文件中获取数据，在本例中为 /notes.html。我试图将 ajax 调用的结果存储在变量中，但它一直返回 undefined，但是当我在 chrome 开发人员工具中运行该函数时，它返回 /notes.html 的内容。这是我修改后的简单代码来记录数据:

    var ajax = {};
    ajax.result = Array();
    ajax.fetch = function(urls,datas){
        $.ajax({
            url: urls,
            type: 'post',
            data: datas,
            success: function(data){
                console.log (data);
            }
        });
    }
    ajax.fetch('/notes.html',{});

现在这就是我要说的。如果我们更改console.log并将其变成return，然后console.log变为ajax.fetch调用，我们得到未定义的结果。

当我将其保存在ajax.result中，然后在chrome dev中调用它时。工具，内容显示在 chrome dev 中。工具，但我无法在基本 javascript 中使用它。

页面是here 。这是一个空白页，但您可以在控制台中看到上面的代码打印出的内容。

Answer 1

ajax本质上是延迟调用，因此从函数返回什么并不重要，原始的提取已经退出并在不久前返回未定义...

您可以将回调传递给 fetch 来解决此问题:

var ajax = {};
var result;
    ajax.result = Array();
    ajax.fetch = function(urls,datas, callback){
        return $.ajax({
            url: urls,
            type: 'post',
            data: datas,
            success: function(data){
                callback(data);
            }
        });
    }
    ajax.fetch('/notes.html',{}, function (data) {
        // execute result related code here to ensure variable already assigned
    });

如果进行跟踪，您将得到以下执行结果:

1. 声明了ajax
2. 结果已公布
3. ajax 设置为 {}
4. ajax.result 设置为一个新数组(顺便说一句，您应该使用 [] 而不是 Array 以避免潜在的原型(prototype)疯狂)
5. ajax.fetch 设置为函数
6. 调用 ajax.fetch，并使用匿名函数作为回调
7. $.ajax 被调用
8. ajax.fetch 返回(这是你的 undefined 的来源，现在它将返回一个 jQuery deferred object )
9. 调用成功回调
10. 调用传递的回调
11. 成功回调返回(无法捕获返回值，因为 fetch 已在 8 中返回)
12. done回调是代码(在这里您可以使用闭包获取的数据)