javascript - 意外的延迟对象的行为

Question

任何人都可以澄清一下下面的代码有什么问题吗(已经阅读了很多文档和示例，但仍然不知道发生了什么)

function t() {
    var d = $.Deferred();
    setTimeout(function(){
        d.resolve();
    }, 5000);
    return d.promise();
}
function test() {
    var dd = $.Deferred();
    $.ajax("/echo/json/").done(function() {
        dd = t();
        dd.done(function() { alert(" dd.done inside ajax")});
    });
    dd.done(function() { alert(" dd.done outside ajax")});
}
test();

输出是(在 ~ 5 秒内):

"dd.done inside ajax:"

为什么第二个 .done 不起作用？

Answer 1

让我们看看test():

function test() {
    var dd = $.Deferred();
    $.ajax("/echo/json/").done(function() {
        dd = t();
        dd.done(function() { alert(" dd.done inside ajax")});
    });
    dd.done(function() { alert(" dd.done outside ajax")});
}
test();

局部变量 dd 被初始化为一个新的 jQuery Deferred 对象。然后，启动一个 ajax 操作，并给出一个“完成”回调，它将调用另一个测试函数 t()。

$.ajax() 调用基本上会立即返回，远早于其 .done() 回调运行。紧接着，另一个 .done() 回调为在函数开始时创建的 Deferred 实例建立。

现在，当 ajax“完成”回调运行时，dd 的值——最初创建的 Deferred 对象——将被 覆盖 返回的 Promise >t()。最终 .done() 回调将运行，但没有任何东西解析第一个 Deferred 实例，因此“外部”回调永远不会发生。