Unerwartete "dann" -Rufreihenfolge mit jQuery verspricht

Question

Ich benutze jQuery verspricht, einige Änderungen auf dem Server zu verfolgen. Ich benutze auch Typoskript, also ist mein Beispiel in Typoskript.

Ich verwende die folgende Methode für die Verfolgung von Änderungen:

startObserve(): JQueryPromise<void> { 
    console.info("initializing..."); 

    const that = this; 
    let countdown = 3; 

    return this.loadData() 
     .then(baseData => { 
      const checkChanges =() => { 
       const d = $.Deferred(); 
       d.then(() => { 
        console.info("checking changes..."); 

        return that.loadData() 
         .then(data => { 
          countdown--; // emulate check logic 

          console.info("next interation! countdown:", countdown); 

          if (countdown === 0) 
           return null; 

          return checkChanges(); 
         }); 
       }); 
       setTimeout(d.resolve, 250); 
       return d.promise(); 
      }; 

      return checkChanges(); 
     }); 
} 

Also ich rekursiv checkChanges Methode nur aufrufen, die erst einige erfasste Änderung neue Versprechen zurück.

Hier ist, wie ich versuche, die startObserve Methode zu verwenden:

this.startObserve() 
     .then(() => { 
      console.info("change detected! we can continue!"); 
     }).fail(() => { 
      console.error("something is very wrong!"); 
     }); 

Ich erwarte, dass die folgende Ausgabe erhalten:

initializing... 
checking changes... 
next interation! countdown: 2 
checking changes... 
next interation! countdown: 1 
checking changes... 
next interation! countdown: 0 
**change detected! we can continue!** 

Aber hier ist, was ich bekommen:

initializing... 
checking changes... 
**change detected! we can continue!** 
next interation! countdown: 2 
checking changes... 
next interation! countdown: 1 
checking changes... 
next interation! countdown: 0 

Es sieht ein bisschen komisch für mich aus. Wo ich falsch liege? Hier ist jsfiddle zeigt das Problem: https://jsfiddle.net/4dofznqL/1/

Answer 1

Sie versprechen durch Timeout statt Verkettungs Ajax Versprechen gelöst Rückkehr:

... 

const checkChanges =() => { 
    const d = $.Deferred(); 
    setTimeout(d.resolve, 250); 

    return d.then(() => { 
    console.info("checking changes..."); 

    return that.loadData() 
     .then(data => { 
     countdown--; 

     console.info("next interation! countdown:", countdown); 

     if (countdown === 0) 
     return null; 

     return checkChanges(); 
    }); 
    }); 
}; 

...