Deferredの状態保持

//状態保持
// 高速でクリックされても、１秒ごとにしかappend()を実行しない
var prevState = new $.Deferred().resolve().promise();

function asyncFuncDef(){
  var deferred = new $.Deferred();
  setTimeout(function(){
    deferred.resolve();
  },1000);
  return deferred.promise();
}
$(document).on('click',function(){
  //最初はappend()が直ぐ実行される
  //asyncFuncDefの結果がprevStateに代入される（１秒立つまでpending）
  //もう一回クリックされたらasyncFuncDefの状態を見る
  //状態がresolveだとthen()が実行される
  //何回も素早くクリックされると、then()が押した分だけキューされる
  //resolveが帰ってきたらキューされたものが一個ずつ実行される
  prevState = prevState.then(function(){
    $('body').append('<p>hoge</p>');
    return asyncFuncDef();
  });
});

コメントは私が追記したものです。
Deferredの状態保持って紹介されてたけど、いまいち流れがつかめない。
素早くクリックされた場合は、代入が実行されずにthen()がキューされて、キューされたものがそれぞれresolve待ちになる。resolveに成ったらasyncFuncDef()の結果（１秒立つまでpendeing）が、prevSateに代入されて、次にキューされてるものがresolveを待つ。。。っていう流れであってるのかな？

動きは以下で確認してください！

See the Pen PpYGZj by 坂本龍太 (@sakamoto-ryouta) on CodePen.

スパゲッティな文章ですね！
あってるか教えてくださいすごい人！！