使用jQuery.Deferred來避免嵌套setTimeout回調

Question

setTimeout -> 
    console.log 'foo' 
    setTimeout -> 
    console.log 'bar' 
    setTimeout -> 
     console.log 'baz' 
    , 1000 
    , 1000 
, 1000 

是否有可能實現與jQuery.Deferred同樣的結果？像下面，也許：

someFunction() 
.then(-> console.log 'foo') 
.then(delay 1000) 
.then(-> console.log 'bar') 
.then(delay 1000) 
.then(-> console.log 'baz') 

也許我錯了，在思維的承諾可以很容易地寫：做了，那麼一旦完成，做B超，然後一旦完成，可做C。

Answer 1

你可以連鎖.then()通話返回新Deferred對象。具體延遲，您可以使用類似：

function someFunction() { 
    var ret = new $.Deferred(); 
    // setTimeout just to simulate `someFunction` taking 1000ms to complete its deferred 
    setTimeout(function() { 
     ret.resolve(); 
    }, 1000); 
    return ret; 
} 

function logger(str) { 
    return function() { 
     console.log("Logger:", str); 
    }; 
} 

function delay(time) { 
    return function() { 
     console.log("Delaying"); 
     var ret = new $.Deferred(); 
     setTimeout(function() { 
      ret.resolve(); 
     }, time); 
     return ret; 
    }; 
} 

someFunction() 
    .then(logger("foo")) 
    .then(delay(3000)) 
    .then(logger("bar")) 
    .then(delay(3000)) 
    .then(logger("baz")); 

DEMO：http://jsfiddle.net/yGcfu/

Answer 2

是的，它是：

delay = (ms) -> -> 
    d = $.Deferred() 
    setTimeout d.resolve, ms 
    d.promise() 

（demo at jsfiddle.net）

或者，對於delay方法比較常見，您省略了封閉（一個->），並使用

….then(-> delay 1000) …