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

Js设计模式

on

  • 2,618 views

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

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

Statistics

Views

Total Views
2,618
Slideshare-icon Views on SlideShare
2,386
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设计模式 Js设计模式 Presentation Transcript

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