• Save
Js设计模式
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Js设计模式

on

  • 2,738 views

结合实例简单介绍js中常用的一些设计模式

结合实例简单介绍js中常用的一些设计模式

Statistics

Views

Total Views
2,738
Views on SlideShare
2,506
Embed Views
232

Actions

Likes
10
Downloads
0
Comments
0

8 Embeds 232

http://www.uedmagazine.com 119
http://wiki.ued.taobao.net 54
http://uedmagazine.com 35
http://static.slidesharecdn.com 10
http://www.itfeed.cn 10
http://www.wangshow.com 2
http://reader.youdao.com 1
http://cache.baidu.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Js设计模式 Presentation Transcript

  • 1. Javascript 设计模式 拔赤 bachi@taobao.com http://www.uedagazine.com 2010-09-17
  • 2. Java编程思想 JavaScript设计模式 (扫盲) (进阶)
  • 3. • 单体 • 桥接 • 工厂 • 装饰者 • 适配器 • 观察者
  • 4. • 单体 • 桥接 • 工厂 • 装饰者 • 适配器 • 观察者
  • 5. 单体 /*单体*/ var Singleton = { attribute1:true, attribute2:10, method1:function(){}, method2:function(){} };
  • 6. • 单体 • 桥接 • 工厂 • 装饰者 • 适配器 • 观察者
  • 7. 桥接 /*桥接*/ Y.on('click',function(e){ //e? }); nodelist.each(function(node){ //node? }); Y.Box.alert('msg',function(box){ //box? });
  • 8. • 单体 • 桥接 • 工厂 • 装饰者 • 适配器 • 观察者
  • 9. 工厂 /*生成各种选号玩法的实例*/ //时时彩组选和值 var ssc_zxhz = new C.AbacusFactory(key1); //大乐透普通玩法 var dlt_n = new C.AbacusFactory(key2); //大乐透上传选球 var dlt_upload = new C.AbacusFactory(key3); //接下来需要对各种玩法进行各自的包装 (简单)工厂:通用构造,初级解耦
  • 10. • 单体 • 桥接 • 工厂 • 装饰者 • 适配器 • 观察者
  • 11. 装饰者 /*对实例进行包装*/ Var node = $(HTMLElement); 装饰者:对实例进行包装
  • 12. 装饰者 续 //创建"时时彩组选和值"包装器 var sscDecorator = function(instance){ //wrap instance return wrapped_instance; }; //通过工厂创建一个玩法实例 var ssc = new C.AbacusFactory('SSC'); //将这个实例进行重新包装 var ssc = sscDecorator(ssc); 彩票一个玩法的实现骨架
  • 13. • 单体 • 桥接 • 工厂 • 装饰者 • 适配器 • 观察者
  • 14. 适配器 多种格式接口的转换器
  • 15. 适配器 续 多种格式接口的转换器
  • 16. • 单体 • 桥接 • 工厂 • 装饰者 • 适配器 • 观察者
  • 17. 观察者 //给a标签绑定一个监听 $('a').onclick = function(){ alert(this); }; 当…的时候,发生…
  • 18. 观察者 – 自定义事件 //给一个widget绑定一个监听 new Y.Calendar('id') .on('select',function(d){ alert(Y.dump(d)); }); http://cubee.github.com/src/calend ar/demo/calendar.html
  • 19. More… 抽象工厂,门面,原型 组合,享元,代理 命令,中介,职责链,备忘录,策略,状态
  • 20. Q&A