over 3 years ago

※これは翻訳記事です
Olivier Wietrich氏の原文はこちら


Emitter

以降のプロジェクトは全て一貫性と学習・使用の簡便さからEmitterに基づいたものになっています

component/emitter

出版-購読 pub/subのパターンを実装するとNode.jsのEventEmitterと似たものになります

Emitter を使うとコードを綺麗に分割することができ、イベントが起こった時だけに実行される動作を書くことができます

var emitter = new Emitter();
emitter.on('data', function(value) {
  //do something on foo

});
emitter.emit('data', 'something');

Promise

Promise を使わずにどうやって JavaScript で非同期を書くというのでしょう

bredele/promise

これは有名なPromiseパターンの仕様であるPromises/A+に基づいた綺麗で軽量な実装です。Promise の状態は一度 resolve や reject されると変えることができません

プロミスはいつ生成されるかわからない値のプロキシのようなものであり、成功したり失敗したりする動作を扱う時の理想的なパターンです

var promise = new Promise();

//a promise is either resolved or rejected

promise.then(function(value) {
  //do something on resolve

}, function(reason) {
  //do something on reject

});
promise.resolve('just because');

Mood

有限状態機械有限状態マシンを使ってコードにいくつかの気分(Mood)を与えます

bredele/mood

Promise とは反対に有限状態機械有限状態マシンはいくつかの状態をもち何回でも状態遷移をすることができます

Mood は(例えば管理者として接続している時のみ表示されるウィジェットのように)文脈コンテキストが必要になる時の理想的な解決方法になります

var states = new Mood('normal');

//define transition open to locked
states.add('normal','connected', function() {
  //do something on transition
}, 'admin');

//trigger transition
states.emit('connected');

Doors

これは初めて見るパターンでしょう

bredele/doors

ドアは開と閉の2つの状態を持ち互いに何回でも入れ替わることができます。Doors の状態遷移は有限状態機械有限状態マシンとは違ってひとつかそれ以上の条件から引き起こされます。ドアを開くためには全てのロックを解除する必要があって一つでもロックされていればドアは閉まってしまうのです。

例えば Doors は(必須項目を錠として)フォームのバリデーションや非同期的な初期化などに最適です。

var door = new Doors('awesome');
door.add('lock1');
door.add('lock2');

door.on('open', function() {
  //door is opened when lock1
  //and 2 are unlocked
});

door.unlock('lock1','lock2');

Emitter queue

キューイベントのプラグイン

bredele/emitter-queue

一つの Emitter は関連するイベントが起こった時に一つの動作を実行します(これはほとんど同期的に見えますw)。Queue は定義されている動作がないときにイベントを待つことでこれを解決します

このQueueを用いることで実行の順番やアプリケーションのことを考える心配がなくなります

var emitter = new Emitter();
queue(emitter);

emitter.queue('foo');
emitter.on('foo', function() {
  //do something on foo
});

原文: Async

  • 2014/04/29 訳語に修正を加えました
← 友達招待イベントに参加する方法! #ウチ姫 facebook/pop を使ってみた →
 
comments powered by Disqus