jQuery.DeferredをMochiKit.Async.Deferredな感じに操作できるプラグイン作った

日頃、もちもちな Deferred に慣れてるせいか、jQuery.Deferred があまりに使い難いので作ってみました
JSDeferred でもよかったのですが、エラー処理が楽なので伝統を継承する感じで。
dojo や Closure Library などの Deferred は MochiKit.Async.Deferred からの派生なので、汎用性はあると思います。

機能概要

• jQuery.Deferred 本体に機能を追加してるだけなので、本来の機能 .done() とかはそのまま使えて他のプラグインも普通に動く(と思う)
• minify版 5KB とけっこう軽量
• jQueryオブジェクトに async という関数オブジェクトが追加される
• Deferred は、今までどおり var d = $.Deferred(); で生成
• たぶん古い環境でも動く

Download

• jquery-async-plugin.zip

使い方

スクリプトを読み込みます

view plainprint?

1. <script src="/path/to/jquery.async.js"></script>  
2. or  
3. <script src="/path/to/jquery.async.min.js"></script>  

<script src="/path/to/jquery.async.js"></script>
or
<script src="/path/to/jquery.async.min.js"></script>

基本の Deferred チェイン:

view plainprint?

1. var d = $.Deferred();  
2. d.addCallback(function() {  
3.     return 1;  
4. }).addCallback(function(res) {  
5.     console.log(res); // 1  
6. });  
7. d.callback();  

var d = $.Deferred();
d.addCallback(function() {
    return 1;
}).addCallback(function(res) {
    console.log(res); // 1
});
d.callback();

succeed() を使った例:

view plainprint?

1. $.async.succeed(1).addCallback(function(res) {  
2.     return res + 1;  
3. }).addCallback(function(res) {  
4.     console.log(res); // 2  
5. });  

$.async.succeed(1).addCallback(function(res) {
    return res + 1;
}).addCallback(function(res) {
    console.log(res); // 2
});

値の受け渡しと、エラー処理:

view plainprint?

1. $.async(function() {  
2.     return 1;  
3. }).addCallback(function(res) {  
4.     console.log(res); // 1  
5.     throw new Error('error');  
6. }).addCallback(function(res) {  
7.     console.log('このメッセージは表示されない');  
8.     return 'noop';  
9. }).addErrback(function(err) {  
10.     console.log(err); // error  
11.     return 'hello';  
12. }).addBoth(function(res) {  
13.     console.log(res); // hello  
14. });  

$.async(function() {
    return 1;
}).addCallback(function(res) {
    console.log(res); // 1
    throw new Error('error');
}).addCallback(function(res) {
    console.log('このメッセージは表示されない');
    return 'noop';
}).addErrback(function(err) {
    console.log(err); // error
    return 'hello';
}).addBoth(function(res) {
    console.log(res); // hello
});

$.async() は、引数の関数を非同期で実行して新しい Deferred チェインを作ります。JSDeferred でいう next() みたいな感じ。

基本的な使い方は GitHub に書いてありますので参考ください。

addCallback() とか addErrback() などの 他の機能については MochiKit.Async と同じなのでリファレンスを参考ください

バグとか問題等ありましたら issues または、Twitter @polygon_planet までご報告ください

レポジトリ

• polygonplanet/jquery-async-plugin - GitHub