链式调用

(function(){
function _$(els){
//...
}
_$.prototype={
each:function(fn){
for(var i=0,len=this.elements.length;i<len;++i){
fn.call(this,this.elements[i]);
}
return this;
},
setStyle:function(prop,val){
this.each(function(el){
el.style[prop]=val;
});
return this;
},
show:function(){
var that=this;
this.each(function(el){
that.setStyle('display','block');
});
return this;
},
addEvent:function(type,fn){
var add=function(el){
if(window.addEventListener){
el.addEventListener(type,fn,false);
}
else if(window.attachEvent){
el.attachEvent('on'+type,fn);
}
};
this.each(function(el){
add(el);
});
return this;
}
};
window.$=function(){
return new _$(arguments);
};
})();

从支持链式调用的方法获取数据

window.API=window.API||function(){
var name='Hello World';
this.setName=function(newName){
name=newName;
return this;
};
this.getName=function(callback){
callback.call(this,name);
return this;
};
};
var o2=new API;
o2.getName(console.log).setName('Meow').getName(console.log);

简单工厂

var BicycleShop=function(){};
BicycleShop.prototype={
sellBicycle:function(model){
var bicycle;
switch(model){
case'The Speedster':
bicycle=new Speedster();
break;
case'The Lowrider':
bicycle=new Lowrider();
break;
case'The Comfort Cruiser':
default:
bicycle=new ComfortCruiser();
}
interface.ensureImplements(bicycle,Bicycle);
bicycle.assemble();
bicycle.wash();
return bicycle;
} };

把成员对象的创建工作交给外部对象

var BicycleFactory={
createBicycle:function(model){
var bicycle;
switch(model){
case'The Speedster':
bicycle=new Speedster();
break;
case'The Lowrider':
bicycle=new Lowrider();
break;
case'The Flatlander':
bicycle=new Flatlander();
break;
case'The Comfort Cruiser':
default:
bicycle=new ComfortCruiser();
}
Interface.ensureImplements(bicycle,Bicycle);
}
};

工厂模式(不是使用另外一个类或对象创建,而是使用子类创建)

var BicycleShop=function(){};
BicycleShop.prototype={
sellBicycle:function(model){
var bicycle=this.createBicycle(model);
bicycle.assemble();
bicycle.wash();
return bicycle;
},
createBicycle:function(model){
throw new Error('...')//抽象类,声明这个方法,但不实现这个方法,直接调用会报错
}
};
var AcmeBicycleShop=function(){};
extend(AcmeBicycleShop,BicycleShop);
AcmeBicycleShop.prototype.createBicycle=function(model){
var bicycle;
switch(model){
case'The Speedster':
bicycle=new AcmeSpeedster();
break;
case'The Lowrider':
bicycle=new AcmeLowrider();
break;
case'The Comfort Cruiser':
default:
bicycle=new AcmeComfortCruiser();
}
Interface.ensureImplements(bicycle,Bicycle);
return bicycle;
};
var GeneralProductsBicycleShop=function(){};
extend(GeneralProductsBicycleShop,BicycleShop);
GeneralProductsBicycleShop.prototype.createBicycle=function(model){
var bicycle;
switch(model){
case'The Speedster':
bicycle=new GeneralProductsSpeedster();
break;
case'The Lowrider':
bicycle=new GeneralProductsLowrider();
break;
case'The Comfort Cruiser':
default:
bicycle=new GeneralProductsComfortCruiser();
}
Interface.ensureImplements(bicycle,Bicycle);
return bicycle;
};
//需要时任意调用即可
//var bobCruisers=new GeneralProductsBicycleShop();
//var yourSecondNewBike=bobCruisers.sellBicycle('The Lowrider');

javascript设计模式7的更多相关文章

  1. 《JavaScript设计模式 张》整理

    最近在研读另外一本关于设计模式的书<JavaScript设计模式>,这本书中描述了更多的设计模式. 一.创建型设计模式 包括简单工厂.工厂方法.抽象工厂.建造者.原型和单例模式. 1)简单 ...

  2. 《JavaScript设计模式与开发实践》整理

    最近在研读一本书<JavaScript设计模式与开发实践>,进阶用的. 一.高阶函数 高阶函数是指至少满足下列条件之一的函数. 1. 函数可以作为参数被传递. 2. 函数可以作为返回值输出 ...

  3. Javascript设计模式学习一

    学习Javascript设计模式之前,需要先了解一些相关知识,面向对象的基础知识.this等重要概念,以及掌握一些函数式编程的技巧. Js多态 多态的思想:实际上是把“做什么”和“谁去做”分离开来.例 ...

  4. javascript设计模式实践之职责链--具有百叶窗切换图片效果的JQuery插件(三)

    在上一篇<javascript设计模式实践之模板方法--具有百叶窗切换图片效果的JQuery插件(二)>里,通过采用模板方法模式完成了切换效果对象的构建编写. 接下来就是完成各效果对象的调 ...

  5. javascript设计模式实践之模板方法--具有百叶窗切换图片效果的JQuery插件(二)

    在上一篇<javascript设计模式实践之迭代器--具有百叶窗切换图片效果的JQuery插件(一)>里,通过采用迭代器模式完成了各初始化函数的定义和调用. 接下来就要完成各个切换效果的编 ...

  6. javascript设计模式实践之迭代器--具有百叶窗切换图片效果的JQuery插件(一)

    类似于幻灯片的切换效果,有时需要在网页中完成一些图片的自动切换效果,比如广告,宣传,产品介绍之类的,那么单纯的切就没意思了,需要在切换的时候通过一些效果使得切换生动些. 比较常用之一的就是窗帘切换了. ...

  7. 常用的Javascript设计模式

    <parctical common lisp>的作者曾说,如果你需要一种模式,那一定是哪里出了问题.他所说的问题是指因为语言的天生缺陷,不得不去寻求和总结一种通用的解决方案. 不管是弱类型 ...

  8. Javascript设计模式(摘译)

    说明: 未完成...更新中.... 一.javascipt设计模式分类 设计模式分类有很多标准,最流行的三种如下 1)  creational  --  主要关注对象创建 Creational des ...

  9. JavaScript设计模式学习笔记

    1 JavaScript设计模式深入分析 私有属性和方法:函数有作用域,在函数内用var 关键字声明的变量在外部无法访问,私有属性和方法本质就是你希望在对象外部无法访问的变量. 特权属性和方法:创建属 ...

  10. JavaScript设计模式:读书笔记(未完)

    该篇随我读书的进度持续更新阅读书目:<JavaScript设计模式> 2016/3/30 2016/3/31 2016/4/8 2016/3/30: 模式是一种可复用的解决方案,可用于解决 ...

随机推荐

  1. myeclipse报jar包missing

    一.问题描述 从版本库中check out项目后,发现项目有“感叹号”,且pom.xml文件有红色的“差号”.如下图: 在error window里可以看到missing jar包的提示,如下: 打开 ...

  2. [cc150] check palindrome of a singly linked list

    Problem: Implement a function to check if a singly linked list is a palindrome. 思路: 最简单的方法是 Reverse ...

  3. PAT-乙级-1016. 部分A+B (15)

    1016. 部分A+B (15) 时间限制 100 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 CHEN, Yue 正整数A的“DA(为1位整数)部 ...

  4. sublime 配置

    Sublime Text 2是那种让人会一眼就爱上的编辑器,不仅GUI让人眼前一亮,功能更是没的说,拓展性目前来说也完全够用了,网上介绍软件的文章和推荐插件的文章也不少,而且很不错,大家可以去找找自己 ...

  5. POJ3297+map字符串处理

    简单的字符串处理题. 要注意细节! 附数据两组: ABCC abc ae AAA abc AAAA abc A a B a C a /* */ #include<stdio.h> #inc ...

  6. hdu 1729 Stone Game 博弈论

    那么对于这题对于每一堆,放石子放满就想当于满的时候取s-c个,反向只是让我理解题意更深. 首先我们知道(S,S)这个局面是必败局面.对于每一堆能加的数量有限,而当c的值(大于或者等于) D=sqrt( ...

  7. android 使用系统照相程序照相并存储、显示在界面上

    大部分业务可以通过调用系统的相机程序来拍照. 界面如下: <?xml version="1.0" encoding="utf-8"?> <Li ...

  8. python string 连接test

    def strTest(): name = "" for i in range(10): name += "hello" #print name def str ...

  9. Android之AlertDialog.Builder详解

    import android.app.Activity; import android.app.AlertDialog; import android.content.DialogInterface; ...

  10. 去除windows的Shift+Space 全角半角切换

    windows7下的输入法,有一个“全/半角切换”的快捷方式“Shift+Space”,我们可以通过以下方式查看到: “开始”->“控制面板”->“区域和语言”->“键盘和语言”-& ...