我一直在阅读jQuery的延迟和承诺,我看不出使用.then()和.done()成功回调之间的区别。我知道Eric Hynds提到.done()和.success()映射到相同的功能,但我猜.then()也是如此,因为所有的回调都是在成功操作完成时调用的。

有人能告诉我正确的用法吗?


当前回答

附加到done()的回调将在延迟被解决时被触发。当延迟被拒绝时,附加到fail()的回调将被触发。

在jQuery 1.8之前,then()只是语法糖:

promise.then( doneCallback, failCallback )
// was equivalent to
promise.done( doneCallback ).fail( failCallback )

从1.8开始,then()是pipe()的别名,并返回一个新的promise,有关pipe()的更多信息,请参阅这里。

success()和error()仅在调用ajax()返回的jqXHR对象上可用。它们分别是done()和fail()的别名:

jqXHR.done === jqXHR.success
jqXHR.fail === jqXHR.error

同样,done()不局限于单个回调,它会过滤掉非函数(尽管在1.8版本中有一个字符串错误,应该在1.8.1中修复):

// this will add fn1 to 7 to the deferred's internal callback list
// (true, 56 and "omg" will be ignored)
promise.done( fn1, fn2, true, [ fn3, [ fn4, 56, fn5 ], "omg", fn6 ], fn7 );

fail()也是一样。

其他回答

在回答中有一个非常简单的心理映射,在其他答案中很难找到:

done实现了蓝鸟承诺中的tap 然后实现然后在ES6承诺

.done()只有一个回调,它是成功回调

.then()有success和fail两个回调函数

.fail()只有一个失败回调

所以你该怎么做就怎么做了…你在乎成功还是失败吗?

在处理返回结果的方式上也有区别(它被称为链接,done不链接,然后产生调用链)

promise.then(function (x) { // Suppose promise returns "abc"
    console.log(x);
    return 123;
}).then(function (x){
    console.log(x);
}).then(function (x){
    console.log(x)
})

将记录以下结果:

abc
123
undefined

promise.done(function (x) { // Suppose promise returns "abc"
    console.log(x);
    return 123;
}).done(function (x){
    console.log(x);
}).done(function (x){
    console.log(x)
})

将得到以下结果:

abc
abc
abc

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

顺便说一句。我忘了说,如果你返回一个Promise而不是原子类型值,外部Promise将等待内部Promise解决:

promise.then(function (x) { // Suppose promise returns "abc"
    console.log(x);
    return $http.get('/some/data').then(function (result) {
        console.log(result); // suppose result === "xyz"
        return result;
    });
}).then(function (result){
    console.log(result); // result === xyz
}).then(function (und){
    console.log(und) // und === undefined, because of absence of return statement in above then
})

通过这种方式,组合并行或顺序异步操作变得非常简单,例如:

// Parallel http requests
promise.then(function (x) { // Suppose promise returns "abc"
    console.log(x);

    var promise1 = $http.get('/some/data?value=xyz').then(function (result) {
        console.log(result); // suppose result === "xyz"
        return result;
    });

    var promise2 = $http.get('/some/data?value=uvm').then(function (result) {
        console.log(result); // suppose result === "uvm"
        return result;
    });

    return promise1.then(function (result1) {
        return promise2.then(function (result2) {
           return { result1: result1, result2: result2; }
        });
    });
}).then(function (result){
    console.log(result); // result === { result1: 'xyz', result2: 'uvm' }
}).then(function (und){
    console.log(und) // und === undefined, because of absence of return statement in above then
})

上面的代码并行地发出两个http请求,从而使请求更快地完成,而下面这些http请求则按顺序运行,从而减少服务器负载

// Sequential http requests
promise.then(function (x) { // Suppose promise returns "abc"
    console.log(x);

    return $http.get('/some/data?value=xyz').then(function (result1) {
        console.log(result1); // suppose result1 === "xyz"
        return $http.get('/some/data?value=uvm').then(function (result2) {
            console.log(result2); // suppose result2 === "uvm"
            return { result1: result1, result2: result2; };
        });
    });
}).then(function (result){
    console.log(result); // result === { result1: 'xyz', result2: 'uvm' }
}).then(function (und){
    console.log(und) // und === undefined, because of absence of return statement in above then
})

只使用.then()

.done()没有优点,以下是缺点:

不能正确地连接 A.done ().done()与A.done()相同;A.done(),可以用a.then()来估计;交配制度() A.then ().then()与.done()不可能 块resolve()调用(所有.done()处理程序将同步执行) Resolve()可能会从已注册的.done()处理程序获取异常(!) .done()中的异常会将被延迟的对象减半: 进一步的.done()处理程序将被无声地跳过 .那么()就没有这些问题了

我暂时认为.then(oneArgOnly)总是需要.catch(),因此没有异常被无声地忽略,但这不再是真的:unhandledrejection事件在控制台上记录未处理的.then()异常(默认)。很合理的!完全没有理由使用.done()。

证明

下面的代码片段显示:

所有.done()处理程序将在resolve()点同步调用。 记录为1,3,5,7 在脚本掉到底部之前记录 .done()中的异常会影响resolve()调用者 通过catch around resolve()记录 异常打破了进一步.done()解析的承诺 8和10没有被记录! .那么()就没有这些问题了 在线程空闲后,记录为2,4,6,9,11 (片段环境似乎没有unhandledrejject)

顺便说一句,.done()的异常不能被正确捕获:由于.done()的同步模式,错误要么在.resolve()抛出(可能是库代码!),要么在.done()调用抛出,如果延迟已经解决,则该调用附加了罪魁祸首。

console.log('Start of script.'); let deferred = $.Deferred(); // deferred.resolve('Redemption.'); deferred.fail(() => console.log('fail()')); deferred.catch(()=> console.log('catch()')); deferred.done(() => console.log('1-done()')); deferred.then(() => console.log('2-then()')); deferred.done(() => console.log('3-done()')); deferred.then(() =>{console.log('4-then()-throw'); throw 'thrown from 4-then()';}); deferred.done(() => console.log('5-done()')); deferred.then(() => console.log('6-then()')); deferred.done(() =>{console.log('7-done()-throw'); throw 'thrown from 7-done()';}); deferred.done(() => console.log('8-done()')); deferred.then(() => console.log('9-then()')); console.log('Resolving.'); try { deferred.resolve('Solution.'); } catch(e) { console.log(`Caught exception from handler in resolve():`, e); } deferred.done(() => console.log('10-done()')); deferred.then(() => console.log('11-then()')); console.log('End of script.'); <script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha384-vk5WoKIaW/vJyUAd9n/wmopsmNhiy+L2Z+SBxGYnUkunIxVxAv/UtMOhba/xskxh" crossorigin="anonymous" ></script>

deferred.done ()

添加仅在Deferred被解析时调用的处理程序。您可以添加多个回调被调用。

var url = 'http://jsonplaceholder.typicode.com/posts/1';
$.ajax(url).done(doneCallback);

function doneCallback(result) {
    console.log('Result 1 ' + result);
}

你也可以这样写在上面,

function ajaxCall() {
    var url = 'http://jsonplaceholder.typicode.com/posts/1';
    return $.ajax(url);
}

$.when(ajaxCall()).then(doneCallback, failCallback);

deferred.then ()

当Deferred被解析、拒绝或仍在进行时,添加要调用的处理程序。

var url = 'http://jsonplaceholder.typicode.com/posts/1';
$.ajax(url).then(doneCallback, failCallback);

function doneCallback(result) {
    console.log('Result ' + result);
}

function failCallback(result) {
    console.log('Result ' + result);
}