javascript优化--10模式(设计模式)01
单体模式:保证一个特定类仅有一个实例;即第二次使用同一个类创建新对象时,应该得到与第一个所创建对象完全相同对象;
- 在JS中,可以认为每次在使用对象字面量创建对象的时候,实际上就在创建一个单体;
- 当使用new创建新对象时
- 使用静态属性中的实例:
function Universe() {
if(typeof Universe.instance === 'object') {
return Universe.instance;
}
this.start_time = 0;
this.bang = 'Big';
Universe.instance = this;
return this;
} - 采用闭包包含单个实例:
function Universe1() {
var instance = this;
this.start_time = 0;
this.bang = 'Big';
Universe1 = function() {
return instance;
}
}var Universe;
(function () {
var instance;
Universe = function Universe() {
if(instance) {
return instance;
}
instance = this;
//增加功能
this.start_time = 0;
this.bang = 'Big';
}
})();
- 使用静态属性中的实例:
工厂模式:
根据字符串指定地类型在运行时创建对象地方法
工厂模式地目的使为了创建对象
- 当创建对象时执行重复操作
- 再编译时不知道具体类型地情况下,为工厂客户提供一个创建对象的接口
function CarMaker() {};
CarMaker.prototype.drive = function() {
return "Vroom, I have " + this.doors + " doors";
};
CarMaker.factory = function(type) {
var constr = type, newcar;
//如果构造函数不存在,则抛出错误
if(typeof CarMaker[constr] != "function") {
throw {
name: "Error",
message: constr + " doesn't exist"
};
}
//构造函数是已知存在的;使原型继承父类,但仅继承一次
if(typeof CarMaker[constr].prototype.drive !== 'function') {
CarMaker[constr].prototype = new CarMaker();
}
//创建一个新的实例
newcar = new CarMaker[constr]();
//选择性地调用一些方法,然后返回
return newcar;
};
CarMaker.Compact = function() {
this.doors = 4;
};
CarMaker.Convertible = function() {
this.doors = 2;
}
CarMaker.SUV = function() {
this.doors = 24;
}
var corolla = CarMaker.factory('Compact');
var solstice = CarMaker.factory('Convertible');
var cherokee = CarMaker.factory('SUV');
corolla.drive();
solstice.drive();
cherokee.drive();
内置对象工厂:对于自然工厂的例子,可以考虑内置的Object()构造函数;它也根据输入类型而创建不同的对象;
迭代器模式:
提供一个API来遍历或操纵复杂地自定义数据结构
迭代访问一个包含某些数据集合的对象的模式;
var agg = (function() {
var index = 0, data = [1,2,3,4,5], length = data.length;
return {
next: function() {
var element;
if(!this.hasNext()) {
return null;
}
element = data[index];
index = index + 2;
return element;
},
hasNext: function() {
return index < length;
},
//重置指针到初始化位置
rewind: function() {
index = 0;
},
//返回当前元素
current: function() {
return data[index];
}
}
}());
//测试
while(agg.hasNext()) {
console.log(agg.next());
}
agg.rewind();
console.log(agg.current());
装饰者模式
可以再运行时动态添加附加功能到对象中;比较方便的特征时其预期行为可制定和可配置;
function Sale(price) {
this.price = price || 100;
}
Sale.prototype.getPrice = function() {
return this.price;
}
Sale.decorators = {};
//增加联邦税
Sale.decorators.fedtax = {
getPrice: function() {
var price = this.uber.getPrice();
price += price * 5/ 100;
return price;
}
};
//增加省级税
Sale.decorators.quebec = {
getPrice: function() {
var price = this.uber.getPrice();
price += price * 7.5 /100;
return price;
}
};
//转化为美元
Sale.decorators.money = {
getPrice: function() {
return "$" + this.uber.getPrice().toFixed(2);
}
};
//格式化为CDN
Sale.decorators.cdn = {
getPrice: function() {
return "CDN$ " + this.uber.getPrice().toFixed(2);
}
};
Sale.prototype.decorate = function(decorator) {
var F = function() {},
overrides = this.constructor.decorators[decorator],
i, newobj;
F.prototype = this;
newobj = new F();
newobj.uber = F.prototype;
for(i in overrides) {
if(overrides.hasOwnProperty(i)) {
newobj[i] = overrides[i];
}
}
return newobj;
}
var sale = new Sale(100);
sale = sale.decorate('fedtax');
sale = sale.decorate('quebec');
sale = sale.decorate('money');
sale.getPrice();
var newsale = new Sale(200);
newsale = newsale.decorate('cdn');
newsale.getPrice();
使用列表实现
function Sale(price) {
this.price = price;
this.decorators_list = [];
}
Sale.decorators = {};
Sale.decorators.fedtax = {
getPrice: function(price) {
return price + price * 5 / 100;
}
};
Sale.decorators.quebec = {
getPrice: function(price) {
return price + price * 7.5 /100;
}
};
Sale.decorators.money = {
getPrice: function(price) {
return "$" + price.toFixed(2);
}
};
Sale.prototype.decorate = function(decorator) {
this.decorators_list.push(decorator)
};
Sale.prototype.getPrice = function() {
var price = this.price, i, max = this.decorators_list.length, name;
for(i = 0; i < max; i++) {
name = this.decorators_list[i];
price = Sale.decorators[name].getPrice(price);
}
return price;
}
var sale = new Sale(100);
sale.decorate('fedtax');
sale.decorate('quebec');
sale.decorate('money');
console.log(sale.getPrice());
javascript优化--10模式(设计模式)01的更多相关文章
- javascript优化--11模式(设计模式)02
策略模式 在选择最佳策略以处理特定任务(上下文)的时候仍然保持相同的接口: //表单验证的例子 var data = { firs_name: "Super", last_name ...
- javascript优化--06模式(对象)01
命名空间: 优点:可以解决命名混乱和第三方冲突: 缺点:长嵌套导致更长的查询时间:更多的字符: 通用命名空间函数: var MYAPP = MYAPP || {}; MYAPP.namespace = ...
- javascript优化--12模式(设计模式)03
观察者模式 通过创建一个可观察的对象,当发生一个感兴趣的事件时将该事件通告给所有观察者,从而形成松散的耦合 订阅杂志 //发布者对象 var publisher = { subscribers: { ...
- javascript优化--08模式(代码复用)01
优先使用对象组合,而不是类继承: 类式继承:通过构造函数Child()来获取来自于另一个构造函数Parent()的属性: 默认模式:子类的原型指向父类的一个实例 function inherit(C, ...
- javascript优化--13模式1(DOM和浏览器模式)
注意分离: 通过将CSS关闭来测试页面是否仍然可用,内容是否依然可读: 将JavaScript关闭来测试页面仍然可以执行正常功能:所有连接是否正常工作:所有的表单是否可以正常工作: 不使用内联处理器( ...
- javascript优化--14模式2(DOM和浏览器模式)
远程脚本 XMLHttpRequest JSONP 和XHR不同,它不受同域的限制: JSONP请求的可以是任意的文档: 请求的URL通常格式为http://example.js?calback=Ca ...
- javascript优化--05模式(函数)
回调函数模式: 基本例子: var findNodes = function (callback) { ...................... if (typeof callback !== ' ...
- javascript优化--09模式(代码复用)02
原型继承 ://现代无类继承模式 基本代码: var parent = { name : "Papa" } var child = object(parent); function ...
- javascript优化--07模式(对象)02
沙箱模式: 解决空间命名模式的几个缺点: 命名空间模式中无法同时使用一个应用程序或库的两个版本运行在同一个页面中,因为两者需要相同的全局符号: 以点分割,需要输入更长的字符,解析时间也更长: 全局构造 ...
随机推荐
- 《PHP程序设计》读书笔记
好久没有更新过我的博客了,主要前一阵子去了实习,现在实习进入尾声,终于有机会看看书了. 在前一阵子的实习中,用到最多就是PHP的CI框架和Jquery,所以现在再看一本有关PHP的书籍来深刻认识一下P ...
- DEDECMS网站数据备份还原教程
备份织梦网站数据 dedecms备份教程 进入DedeCms后台 -> 系统 -> 数据库备份/还原 备份文件在\data\backupdata 下载数据库备份资料\data\backup ...
- nginx: [error] invalid PID number "" in "/usr/local/nginx/logs/nginx.pid"
iwangzheng.com tty:[0] jobs:[0] cwd:[/opt/nginx/conf] 12:45 [root@a02.cmsapi]$ /usr/local/nginx/sbin ...
- 谷歌浏览器 DEV Tools
谷歌浏览器如今是Web开发者们所使用的最流行的网页浏览器.伴随每六个星期一次的发布周期和不断扩大的强大的开发功能,Chrome变成了一个必须的工具.大多数可能熟悉关于chorme的许多特点,例如使用c ...
- 深度学习入门教程UFLDL学习实验笔记二:使用向量化对MNIST数据集做稀疏自编码
今天来做UFLDL的第二个实验,向量化.我们都知道,在matlab里面基本上如果使用for循环,程序是会慢的一逼的(可以说基本就运行不下去)所以在这呢,我们需要对程序进行向量化的处理,所谓向量化就是将 ...
- 基于贪心算法的几类区间覆盖问题 nyoj 12喷水装置(二) nyoj 14会场安排问题
1)区间完全覆盖问题 问题描述:给定一个长度为m的区间,再给出n条线段的起点和终点(注意这里是闭区间),求最少使用多少条线段可以将整个区间完全覆盖 样例: 区间长度8,可选的覆盖线段[2,6],[1, ...
- MySQL5.5 RPM安装的默认安装路径
MySQL5.5 RPM安装的默认安装路径 2011-06-20 10:34:32| 分类: MySQL|举报|字号 订阅 下载LOFTER客户端 由于一客户要求安装mysql- 5.5 ...
- Gson简要使用
哇,原来我已经潜水2年多了,还是需要养成习惯写写东西啊. 最近在做一个java web service项目,需要用到jason,本人对java不是特别精通,于是开始搜索一些java平台的json类库. ...
- jQuery属性,方法操作
addClass() 向匹配的元素添加指定的类名.attr() 设置或返回匹配元素的属性和值.hasClass() 检查匹配的元素是否拥有指定的类.html() 设置或返回匹配的元素集合中的 HTM ...
- 《ASP.NET1200例》ListView 控件与DataPager控件的结合<二>
ASP.NET使用ListView数据绑定控件和DataPager实现数据分页显示 为什么使用ListView+DataPager的方式实现分页显示? .net提供的诸多数据绑定控件,每一种都有它自己 ...