首頁猿問 jQuery延遲和承諾-.Then...

jQuery延遲和承諾-.Then()vs.Done()

JQuery

開心每一天1111 2019-06-28 15:25:37

jQuery延遲和承諾-.Then()vs.Done()我一直在閱讀關(guān)于jQuery延遲和承諾的文章，我看不出使用.then() & .done()為了成功的回調(diào)。我知道呀艾瑞克·海因茲提到.done()和.success()映射到相同的功能，但我猜也是如此.then()因?yàn)樗谢卣{(diào)都是在一個(gè)成功的操作完成后調(diào)用的。有人能告訴我正確的用法嗎？

查看完整描述

3 回答

一只名叫tom的貓

TA貢獻(xiàn)1906條經(jīng)驗(yàn) 獲得超3個(gè)贊

處理返回結(jié)果的方式也有差異(稱為鏈接，done不鎖鏈then生產(chǎn)呼叫鏈)

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)})

將記錄下列結(jié)果：

abc123undefined

當(dāng)

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

-更新：

順便說一下。我忘了提到，如果您返回一個(gè)承諾而不是原子類型的值，外部承諾將等待內(nèi)部承諾解決：

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})

通過這種方式，組成并行或順序異步操作變得非常簡(jiǎn)單，例如：

// Parallel http requestspromise.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})

上面的代碼并行地發(fā)出兩個(gè)http請(qǐng)求，從而使請(qǐng)求更快地完成，而下面的http請(qǐng)求是按順序運(yùn)行的，從而減少了服務(wù)器負(fù)載。

// Sequential http requestspromise.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})

反對(duì) 回復(fù) 2019-06-28