шаг за шагом JQuery с $ .Deferred()

Question

Вот тестовый код:

var dfd_1 = $.Deferred(), 
    dfd_2 = $.Deferred(), 
    dfd_3 = $.Deferred(); 

function test(content, waitTime, dfd) { 
    console.log(content + ' begin'); 
    setTimeout(function() { 
     console.log(content + ' end'); 
     dfd.resolve(); 
    }, waitTime); 
    return dfd.promise(); 
} 

$.when(test('first', 2000, dfd_1), test('second', 4000, dfd_2), test('third', 6000, dfd_3)) 
.then(function() { 
    console.log('all done'); 
}); 

В результате из консоли: начинается

first begin 
second begin 
third begin 

first end 
second end 
third end 

all done 

3 функции и после того, как шаг за шагом заканчивается Но я необходимо привести, как это (начало конца, начало конца ...):

first begin 
first end 

second begin 
second end 

third begin 
third end 

all done 

Как сделать $ .Deferred работа шаг за шагом? помочь мне, пожалуйста, с решением

Answer 1

Использование then():

test('first', 2000, dfd_1) 
    .then(function() { 
     return test('second', 4000, dfd_2); 
    }) 
    .then(function() { 
     return test('third', 6000, dfd_3); 
    }) 
    .then(function() { 
     console.log('all done'); 
    }) 
; 

Fiddle: http://jsfiddle.net/saj5stt9/