javascript - 为什么 jQuery.then() 在使用 $.deferred 和 $.ajax 时表现不同

Question

我一直在努力了解 jQuery Deferred 对象。我的目的是检查每个 ajax 响应(成功/失败)。我想在不干扰声明典型 $.ajax().done().fail() 请求的其他代码的情况下执行此操作。

我已经使用 $.ajaxPrefilter() 在执行每个 ajax 请求之前获取它。在 jqXHR 对象上使用 .then() 方法，我设法添加了一个函数，该函数将在放置在原始 $.ajax() 调用上的 .done() 方法之前调用

下面的代码将打印出以下内容:

def done
def then
2nd ajax prefilter then
2nd ajax done
2nd ajax then
ajax done
ajax then

我不明白的是为什么预过滤步骤先执行。我本以为它最后执行了，或者根本没有执行。

行为是我想要的，但我不明白为什么。

// this is a typical usage of deferred with two done functions added, the second via .then()
var def = $.Deferred();
def.done(function(){
    document.write("def done<br>");
});
def.then(function(){
    document.write("def then<br>");
});
def.resolve();

// this is a typical ajax request with a done function added, followed by another using .then()
$.ajax("/echo/json/").done(function(){
    document.write("ajax done<br>");
}).then(function(){
    document.write("ajax then<br>");
});

// for the third request i intercept and call the .then() method 
$.ajaxPrefilter( 
    function( options, originalOptions, jqXHR ) {
                jqXHR.then(function(data, textStatus, jqXHR){
                     document.write("2nd ajax prefilter then<br>");
                    });
            });

// create a typical ajax request. these will be executed after the prefilter .then()
$.ajax("/echo/json/").done(function(){
    document.write("2nd ajax done<br>");
}).then(function(){
    document.write("2nd ajax then<br>");
});

在此先感谢您的帮助

更新:------------

来自@Bergi 的回复，下面的代码演示了如何在 done() 之前调用 $.ajaxPrefilter()。

$.ajaxPrefilter( 
    function( options, originalOptions, jqXHR ) {
            document.write("prefilter function within $.ajax call<br>");
                jqXHR.then(function(data, textStatus, jqXHR){
                     document.write("2nd ajax prefilter then<br>");
                    });
            });

var functionToRunWhenDoneIsCalled = function() {
    document.write("done is called function<br>");
    return function(){
       document.write("2nd ajax done<br>");
    }
}

$.ajax("/echo/json/").done(
    (functionToRunWhenDoneIsCalled)()
).then(function(){
    document.write("2nd ajax then<br>");
});

这个输出:

prefilter function within $.ajax call
done is called function
2nd ajax prefilter then
2nd ajax done
2nd ajax then

这回答了我关于 .then() 方法如何在 .done() 方法之前附加到延迟的 jqXHR 对象的问题。

Answer 1

在您的情况下，使用 .done() 添加回调没有区别或 .then() .仅使用 .done()就足够了。

What I don't understand is why the prefilter step executes first. I would have expected it to have been executed last, or not at all.

回调按照它们被添加到延迟对象的顺序执行。预过滤器在 $.ajax 内部执行，即回调甚至在 $.ajax 之前附加调用返回和您的 done和 then可以附加处理程序。