IT戦記

プログラミング、起業などについて書いているプログラマーのブログです😚

お手軽 Deferred を作ってみた

昨日 id:cho45 たちと飲んで

deferred のメリットを教えてもらいました><
で、僕も色々考えて自家製を作ってみました。

自家製 deferred 用関数

var defer = function(f) {
  var fs = [];
  if (f) fs.push(f);
  var deferred = function(f) {
    if (f) fs.push(f);
    setTimeout(function() {
      while (fs.length) {
        var f = fs.shift()();
        if (f && f.isdeferred) {
          setTimeout(arguments.callee, 0);
          break;
        }
      }
    }, 0);
    return function(f) {
      if (f) fs.push(f);
      return arguments.callee;
    }
  };
  deferred.isdeferred = true;
  return deferred;
};

以下のように使います。

以下のような普通の処理があるとして
test(1);
test(2);
test(3);
まず、これをこう変換します。
(function(f) {

  test(1);

  return f;
})(function(f) {

  test(2);

  return f;
})(function(f) {

  test(3);

  return f;
})();

この時点で、最初の例とこの例はまったく同じ結果になります。

そして、処理を切り離したい個所を defer します。
(function(f) {

  test(1);

  return defer(f); // <- test(1), test(2) の間
})(function(f) {

  test(2);

  return f;
})(function(f) {

  test(3);

  return f;
})();

このようにすると test(1) と test(2) は順に実行されますが、スレッドのように別の処理(レンダリング処理など)が割り込めるようになります。
test(2) と test(3) は連続で実行され処理が割り込めません。

特徴は

defer するかどうかを簡単に切り替えられるところです。
deferred ってこんなの?あってる?><
間違ってたら教えてほしいです。あまり理解できてないかもしれないので