简介
在[PHP设计模式(七):设计模式分类][2]中我们提到过创建设计模式(Creation
patterns),创建设计模式专注于设计对象(Object)和实例(Instance)的创建过程。
创建设计模式包括下面五种设计模式:
抽象工厂设计模式(Abstract Factory)
生成器模式(Builder)
工厂设计模式(Factory Method)
原型设计模式(Prototype Method)
单例设计模式(Singleton)
当程序逐渐扩展的时候,需要更多的新对象,新对象的创建不应该依赖于创建者,换句话说,新对象的创建过程,不应该依赖调用创建函数的对象。为了减少冗余,增加拓展性,工厂模式就是一种
继续阅读 »
简介
在[PHP设计模式(八):工厂模式][2]中我们介绍了创建设计模式(Creation
patterns)中的工厂模式,下面我们将介绍另一种原型设计模式(Prototype Method)。
在PHP中,原型设计模式依靠cloning复制对象来实现。通过cloning构造的对象,将大量节省新对象的构造时间。
何时使用原型设计模式?
简单来说,当你希望根据已有的对象来创建新对象时。
为什么会有这种需求?想象一下,你在做细胞分裂的项目,每一个细胞都是一个对象,现在你有一个细胞类,每一个新的细胞都是由这个类生成的,不同的细胞只是内部的状态参数不同。
当分裂到第N代的时候,已经和初代大不一样了,你是愿意使用第N代的副本
继续阅读 »
缘由
JavaScript 数组去重经常出现在前端招聘的笔试题里,比如:
有数组 var arr = ['a', 'b', 'c', '1', 0, 'c', 1, '', 1, 0],请用 JavaScript
实现去重函数 unqiue,使得 unique(arr) 返回 ['a', 'b', 'c', '1', 0, 1, '']
作为笔试题,考点有二:
正确。别小看这个考点,考虑到 JavaScript 经常要在浏览器上运行,在千姿百态的各种浏览器环境下要保障一个函数的正确性可不是一件简单的事,不信你继续读完这篇博客。
性能。虽然大部分情况下 JavaScript 语言本身(狭义范畴,不包含 DOM 等延拓)不会导
继续阅读 »
装饰者模式:给对象动态地增加职责。跟继承相比,装饰者是一种更轻便灵活的做法,是一种“即用即付”的方式。
js的装饰者
假设我们在编写一个飞机大战游戏,这个飞机可以升级,发射导弹,发射原子弹
var plane = {
fire: function() {
console.log('发射普通子弹');
}
};
var missileDecorator = function() {
console.log('发射导弹');
};
var atomDecorator = function() {
console.log('发射原子弹');
};
var fire1 = plane.f
继续阅读 »
中介者模式的作用就是解除对象与对象之间的紧耦合关系。增加一个中介者对象后,所有的相关对象都可以通过中介者对象来通信,而不是相互引用,所以当一个对象发生改变时,只需要通知中介者对象即可。中介者模式使网状的多对多关系变成了相对简单的一对多关系。
中介者模式的例子--购买商品
假如我们正在编写一个手机购买的页面,在购买流程中,可以选择手机的颜色以及输入购买数量,同时页面中有两个展示区域,分别向用户展示选择好的颜色和数量。
show the code:
var colorSelect = document.getElemmentById('colorSelect'),
numberInput= document.getEl
继续阅读 »
发布—订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知。在JavaScript开发中,我们一般用事件模型来替代传统的发布—订阅模式。
发布—订阅模式可以广泛应用于异步编程中,这是一种替代传递回调函数的方案。比如,我们可以订阅ajax 请求的error、succ 等事件。 或者如果想在动画的每一帧完成之后做一些事情,那我们可以订阅一个事件,然后在动画的每一帧完成之后发布这个事件。在异步编程中使用发布—订阅模式,我们就无需过多关注对象在异步运行期间的内部状态,而只需要订阅感兴趣的事件发生点。
发布—订阅模式可以取代对象之间硬编码的通知机制,一个对象不用再显式地调用
继续阅读 »
使多个对象都有机会处理请求,从而避免请求的发送者和接收者之间的耦合关系,将这些对象都练成一条链,并沿着这条链传递该请求,直到有一个对象处理它为止。
如图所示:
请求→A→B→C→D
再来一个更形象的比喻,读书的时候假设你坐在前面,要在上课时告诉后排一些事情,这时候你可能会选择写一张小纸条,小纸条就会陆续的被向后传递。
从上面的例子中,我们可以看到职责链的优点:请求发送者只需要知道链中的第一个节点,从而弱化了发送者和一组接收者之间的强联系。
实际开发中的职责链模式
需求:一个售卖手机的电商网站,交纳500定金和200定金和没交定金的有不同的优惠状况。
我们刚开始可能会这么写:
// orderType: 订单类
继续阅读 »
享元模式的核心是运用共享技术来有效支持大量细粒度的对象。如果系统中因为创建了大量类似的对象而导致内存占用过高,享元模式就非常有用了。在JavaScript中,浏览器特别是移动端的浏览器分配的内存不算多,如何节省内存就成了一件非常有意义的事。
初识
假设有个内衣工厂,要50个男模50个女模,你可能会这么写程序:
var Model = function(sex, underwear) {
this.sex = sex;
this.underwear = underwear;
}
Model.prototype.takePhoto = function() {
console.log('sex=' + th
继续阅读 »
用一个变量来标志当前是否已经为某个类创建过对象,如果是,则在下一次获取该类的实例时,直接返回之前创建的对象。
实现单例模式
//1.实现单例模式
var Singleton = function (name) {
this.name = name;
};
Singleton.prototype.getName = function() {
alert(this.name);
};
Singleton.getInstance = (function() {
var instance = null;
return function(name) {
if (!instance) {
instance
继续阅读 »
用策略模式实现缓动动画
需求:让小球以各种缓动效果在页面中运动
动画开始前需要记录的:
小球所在原始位置
小球移动的目标位置
动画开始时的时间点
小球运动的时间点
之后,用setInterval创建一个定时器,定时器每19秒循环一次。
//缓动算法,此算法移植于flash
var tween = {
//t:动画已消耗的时间,b:小球原始位置,c:小球目标位置,d:动画持续时间
linear: function(t, b, c, d) {
return c*t/d + b;
},
reseIn: function(t, b, c, d) {
ret
继续阅读 »