Contenu connexe Similaire à for JSDeferred Code Reading Similaire à for JSDeferred Code Reading (20) Plus de Kenichirou Oyama (8) 2. What's JSDeferrd
• JavaScript非同期/同期ライブラ
リ
–Author id:cho45
• とにかくすごい
TechTouch #0b10 2
3. JSDeferrd ex1
Deferred
.next(function(){
two();
//2
return '2';
})
.next(function(x){
alert(x);//>2
three();
//3
});
one();
//1
TechTouch #0b10 3
4. JSDeferrd ex2
Deferred
.next(function(){
two();
//2
Deferrd.ng('error');
})
.next(function(res){
three();
//スルー
})
.error(function(e){
alert(e);//>'error'
//3
});
one();
//1
TechTouch #0b10 4
5. JSDeferrd Code Reading
• JSDeferrdを効果的に使用するた
めにはソースを読む必要があるら
しい。
• 各地でJSDeferred Code Reading
開催
–Roppongi.JS
–Kanasan.JS
• ソースコードはわずか400行弱
TechTouch #0b10 5
7. next_default()
Deferred.next_default = function (fun)
{
var d = new Deferred();
var id = setTimeout(function ()
{ d.call() }, 0);
d.canceller = function ()
{ clearTimeout(id) };
if (fun) d.callback.ok = fun;
return d;
};
TechTouch #0b10 7
10. for JSDeferrd Code Reading
• まずはJavaScriptを理解する必要
がある。
–setTimeout()
•非同期
–Method Chain
•jQueryでも重要
–Error Handling
TechTouch #0b10 10
12. setTimeout()
• タイマーイベント
setTimeout("alert('three')",3000);
alert('one');
setTimeout("alert('two')",1000);
TechTouch #0b10 12
13. setTimeout()
• イベントを割り当てる>イベント
発火まではユーザ側にハンドリン
グが戻る
–wait()やsleep()もブラウザに負荷
をかけず作成可能
TechTouch #0b10 13
15. Method Chain
var Hoge={
call:function (str){
console.log(str); return this;
},
callcall:function (str){
console.log(str);console.log(str); return this;
}
}
Hoge.call('a').callcall('b');//> abb
TechTouch #0b10 15
16. jQuery/jQuery Plugin
(function($) {
// $.tag
$.tag = function(name) {
return jQuery('<' + name + ' />');
};
// tag
$.fn.tag = function(name) {
var self = this;
return self.pushStack($.tag(name));
};
// gat
$.fn.gat = function() {
var self = this;
return self.end().append(self); Method Chain
};
})($); // function($)
TechTouch #0b10 16
