设计模式 --深入理解javascript
/*
一、单例模式
*/
var Universe;
(function () {
var instance;
Universe = function Universe() {
if (instance) {
return instance;
}
instance = this;
};
}());
/*
二、构造函数模式
*/
function VM() {
this.name = "123";
}
VM.prototype.Method = function () { }
var vm = new VM();
/*
三、建造者模式 --- 回调
一个复杂对象由多个部分对象构成,应对部分对象发生变化,组合后算法结构不变的情况
*/
// 回调:回调函数的处理,不关心数据来源,如ajax里的succes
function GetBeer(id, callback) {
//复杂对象 = GetBeer ,算法结构不变
asyncRequest('get', URL, function (resp) {
//部分对象callback,算法变化
callback(resp, responseText);
});
}
var el = document.querySelector('#test');
el.addEventListener('click', GetBeerByIdBridge, false); function GetBeerByIdBridge(e) {
GetBeer(this.id, function (beer) { });
}
/*
四、工厂模式
*/
//创建对象时,无需指定创建对象的具体类
var productManager = {};
productManager.createProductA = function () { };
productManager.createProductB = function () { }
productManager.factory = function (type) {
return new productManager[type]();
}
productManager.factory("createProductA");
/*
五、装饰者模式
*/
// 为已有功能动态地添加更多功能的一种方式,把每个要装饰的功能放在单独的函数里,然后用该函数包装所要装饰的已有函数对象
// 优点是把类(函数)的核心职责和装饰功能区分开了
var tree = {};
tree.decorate = function () { }
tree.getDecorate = function (funcName) {
tree[funcName].prototype = this;//指定当前方法的原型
return new tree[funcName];
}
tree.Blue = function () {
this.decorate = function () {
this.Blue.prototype.decorate();//先执行原型的decorate 即:tree.decorate();
}
}
tree.Red = function () {
this.decorate = function () {
this.Red.prototype.decorate();//先执行原型的decorate 即:tree.Bule.decorate();
}
}
tree = tree.getDecorate("Bule");//将Bule赋值给tree,父级原型tree.Decorate可用
tree = tree.getDecorate("Red");//将Red赋值给tree,父级原型tree.Bule.Decorate可用
tree.decorate();
/*
六、外观模式
*/
// 把一些复杂操作封装起来,并创建一个简单的接口用于调用
/*
使用条件
首先,设计阶段:三层架构之间建立外观Facade。
其次,开发阶段:子系统越来越复杂,增加外观Facade可以提供一个简单的接口,减少他们之间的依赖。
第三,老系统过于复杂,无法再进行修改,让新系统与外观facade交互。
*/
var moduleEvent = {
stop: function (e) {
e.preventDefault();
e.stopPropagation();
}
}
/*
七、代理模式
1.远程代理,也就是为了一个对象在不同的地址空间提供局部代表,这样可以隐藏一个对象存在于不同地址空间的事实,就像web service里的代理类一样。
2.虚拟代理,根据需要创建开销很大的对象,通过它来存放实例化需要很长时间的真实对象,比如浏览器的渲染的时候先显示问题,而图片可以慢慢显示(就是通过虚拟代理代替了真实的图片,此时虚拟代理保存了真实图片的路径和尺寸。
3.安全代理,用来控制真实对象访问时的权限,一般用于对象应该有不同的访问权限。
4.智能指引,只当调用真实的对象时,代理处理另外一些事情。例如C#里的垃圾回收,使用对象的时候会有引用次数,如果对象没有引用了,GC就可以回收它了
*/
var girl = function (naem) { }
var sneder = function () {
this.send = function () { }
}
var proxy = function () {
this.send = function () {
(new sender()).send();
}
}
/*
八、观察者模式 -- 发布订阅模式
多个观察者观察一个主题对象,主题对象发生变化,通知所有观察者
*/
var pubsub = {};
(function (q) {
var topics = {},
subUid = -1;
//订阅方法
q.subscribe = function (topic,func) {
if (!topics[topic]) {
topics[topic] = [];
}
var token = (++subUid).toString();
topics[topic].push({
token: koken,
func: func
});
return token;
}
//取消订阅
q.unSubscribe = function (token) {
for (var m in topics) {
if (topics[m]) {
for (var i = 0, j = topics[m].length; i < j;i++) {
if (topics[m].token==token) {
topics[m].splice(i, 1);
return token;
}
}
}
}
return false;
}
//发布方法
q.publish = function (topic,args) {
if (!topics[topic]) {
return false;
}
setTimeout(function () {
var subscribers = topics[topic],
len = subscribers ? subscribers.length : 0;
while (len--) {
subscribers[len].func(topic, args);
}
}, 0);
}
}(pubsub));
设计模式 --深入理解javascript的更多相关文章
- js架构设计模式——理解javascript中的MVVM开发模式
理解javascript中的MVVM开发模式 http://blog.csdn.net/slalx/article/details/7856769 MVVM的全称是Model View ViewMod ...
- 【设计模式+原型理解】第一章:使用Javascript来巧妙实现经典的设计模式
刚开始学习设计模式之前,我是没想说要学习设计模式的,我只是因为想学习JS中的原型prototype知识,一开始我想JS中为什么要存在原型这个东西?于是慢慢通过原型而接触到设计模式,后来发现我这个过程是 ...
- 深入理解JavaScript系列(38):设计模式之职责链模式
介绍 职责链模式(Chain of responsibility)是使多个对象都有机会处理请求,从而避免请求的发送者和接受者之间的耦合关系.将这个对象连成一条链,并沿着这条链传递该请求,直到有一个对象 ...
- 深入理解JavaScript系列(36):设计模式之中介者模式
介绍 中介者模式(Mediator),用一个中介对象来封装一系列的对象交互.中介者使各对象不需要显式地相互引用,从而使其耦合松散,而且可以独立地改变它们之间的交互. 主要内容来自:http://www ...
- 深入理解JavaScript系列(30):设计模式之外观模式
介绍 外观模式(Facade)为子系统中的一组接口提供了一个一致的界面,此模块定义了一个高层接口,这个接口值得这一子系统更加容易使用. 正文 外观模式不仅简化类中的接口,而且对接口与调用者也进行了解耦 ...
- 深入理解JavaScript系列(31):设计模式之代理模式
介绍 代理,顾名思义就是帮助别人做事,GoF对代理模式的定义如下: 代理模式(Proxy),为其他对象提供一种代理以控制对这个对象的访问. 代理模式使得代理对象控制具体对象的引用.代理几乎可以是任何对 ...
- 深入理解JavaScript系列(25):设计模式之单例模式
介绍 从本章开始,我们会逐步介绍在JavaScript里使用的各种设计模式实现,在这里我不会过多地介绍模式本身的理论,而只会关注实现.OK,正式开始. 在传统开发工程师眼里,单例就是保证一个类只有一个 ...
- 深入理解javascript之设计模式
设计模式 设计模式是命名.抽象和识别对可重用的面向对象设计实用的的通用设计结构. 设计模式确定类和他们的实体.他们的角色和协作.还有他们的责任分配. 每个设计模式都聚焦于一个面向对象的设计难题或问题. ...
- 深入理解JavaScript系列(33):设计模式之策略模式(转)
介绍 策略模式定义了算法家族,分别封装起来,让他们之间可以互相替换,此模式让算法的变化不会影响到使用算法的客户. 正文 在理解策略模式之前,我们先来一个例子,一般情况下,如果我们要做数据合法性验证,很 ...
随机推荐
- Windows2003 Apache 关闭安全 开启错误输入到屏幕上
早上帮客户迁移网站的时候发现,打开网站是空白,什么都没报错,环境也是自己配置的,在客户的网站主目录写个测试页也可以打开,环境是APache+PHP5.2的新环境,当时就有点郁闷了,去Apache的er ...
- 用户 'sa' 登录失败。 (Microsoft SQL Server,错误: 18456)
今天登陆数据库的时候,却忽然登陆了不了,并且提示了这样的错: 解决方法: 1.用Windows身份登录数据库 2.安全性==>登录名==>双击sa 3.重设密码 4.状态==>登录: ...
- 关于overflow-y:scroll ios设备不流畅的问题
最近做双创项目的时候因为页面有很多数据显示,所以打算让它Y轴方向滚动条的形式展现,但在测试阶段发现IOS设备滑动效果非常不理想: search by google之后找到解决办法: -webkit-o ...
- luigi学习7--running from command line
最简单去运行一个luigi task的方式是通过luigi命令行工具. 示例代码: # my_module.py, available in your sys.path import luigi cl ...
- 如何创建ajax对象?
1.IE低版本 2.非IE和高版本 <script> function createAjax(){ var request=false; //window对象中有XMLHttpReques ...
- delphi控件安装与删除
附带通用控件安装方法:----------基本安装1.对于单个控件,Componet-->install component..-->PAS或DCU文件-->install;2.对于 ...
- 使用RMAN验证备份的有效性
--验证控制文件和参数文件: RMAN> restore validate controlfile; Starting allocated channel: ORA_DISK_1 channel ...
- Storm入门学习随记
推荐慕课网视频:http://www.imooc.com/video/10055 ====Storm的起源. Storm是开源的.分布式.流式计算系统 什么是分布式呢?就是将一个任务拆解给多个计算机去 ...
- Python核心编程--学习笔记--9--文件和输入输出
本章将深入介绍Python的文件处理和相关输入输出能力,包括:文件对象(以及它的内建函数.内建方法和属性),标准文件,文件系统的访问方法,文件执行,最后简要涉及持久存储和标准库中与文件有关的模块. 1 ...
- .net 内存分配及垃圾回收总结
生存期垃圾回收器 目前有很多种类型的垃圾回收器.微软实现了一种生存期垃圾回收器(Generation Garbage Collector). 生存期垃圾回收器将内存分为很多托管堆,每一个托管堆 ...