本文为阅读《js设计模式与开发实践》摘录。
一. 单例模式
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已经有值 就用之前的值
instance = new Singleton(name)
}
return instance;
}
})()
var a = Singleton.getInstance('test1')
var b = Singleton.getInstance('test2')
console.log(a === b)
二.策略模式
定义
在程序设计中,要实现某个功能会有多种方案可以选择.这种解决方案就是策略模式
定义一系列算法,把他们一个个封装起来,并且使他们可以相互替换
案例
绩效为S的人年终奖4倍工资,绩效为A的年终奖为3倍,绩效为B的年终奖2倍
//面向对象方式
var performanceS = function(){};
performanceS.prototype.calculate = function(salary){
return salary * 4
}
var performanceA = function(){};
performanceA.prototype.calculate = function(salary){
return salary * 3
}
var performanceB = function(){}
performanceB.prototype.calculate = function(salary){
retun salary * 2
}
//定义奖金类
var Bouns = function(){
this.salary = null;
this.strategy = null;
}
Bouns.prototye.setSalary = function(salay){
this.salary = salary;
}
Bouns.prototype.setStrategy = function(){
this.strategy = strategy;
}
Bouns.prototype.getBouns = function(){
return this.strategy.calculate(this.salary)
}
var bouns = new Bouns();
bouns.setSalary(100000);
bouns.setStrategy(new PerformanceS());
bouns.getBouns() // 40000
bouns.setStrategy(new PerformanceA())
bouns.getBouns() // 30000
//js函数方法
var strategies = {
"S":function(salary){
return salary * 4;
},
"A":function(salary){
return salary * 3
},
"B":function(salary){
return salary * 2
}
}
var calculateBouns = function(level,salary){
return strategies[level](salary)
}
calculateBouns('S',10000) //40000
calculateBouns('A',10000) // 20000
优点
- 避免多重条件选择语句
- 提供了对开放-封闭原则的支持,将算法封装在strategy中,使得他们易于切换,易于理解,易于扩展
- 可以复用在系统的其他地方
三.代理模式
定义
代理模式是为一个对象提供一个代用品或占位符,以便控制对它的访问
代理模式的关键是,当客户不方便直接访问一个对象或者不满足需要的时候,提供一个替身对象来控制对这个对象的访问,客户实际上访问的是替身对象,替身对象对请求做出一些处理之后,再把请求转交给本体对象
类似买二手房,通过中介去完成交易,买家直接和中介对接.中介再和卖家对接.
案例
A要给M送花.M心情好的时候,成功率为60%;M心情不好的时候,成功率趋向于0;
A和M刚认识.而A的朋友B和M关系很好,则A把花交给B,让B在M心情好的时候把花送给他
var Flower = function(){}
var A = {
sendFlower: function(target){
var flower = new Flower();
target.recieveFlower(flower);
}
}
var B= {
recieveFlower: function(flower){
M.listenGoodMood(function(){
M.recieveFlower(flower)
})
}
}
var M = {
recieveFlower:function(flower){
console.log('收到花'+ flower)
},
listenGoodMood:function(fn){
setTimeout(function(){ // 假设10秒后心情变好.
fn()
},10000)
}
}
A.sendFlower(B)
求乘积
var mult = function(){
console.log('开始计算乘积');
var a = 1 ;
for(var i = 0 ; i < arguments.length;i++){
a = a * arguments[i]
}
return a;
}
var proxyMult = (function(){
var cache = {};
return function(){
var args = Array.prototype.join.call(arguments,',')
if(args in cache){
return cache[args]
}
return cache[args] = mult.apply(this,arguments)
}
})()
proxyMult (1,2,3,4); // 开始计算乘积 24
proxyMult (1,2,3,4); // 24 取缓存里的值 不走mult函数了
四.发布-订阅者模式
发布-订阅者模式又叫观察者模式,他定义对象间的一种一对多的依赖关系,
案例
var event = {
clientList : [],
listen:function(key,fn){
if(!this.clientList[key]){ // 如果没有订阅过,则给该类消息创建一个缓存列表
this.clientList[key] = []
}
this.clientList[key].push(fn) //订阅的消息添加进缓存列表
},
trigger:function(){
var key = Array.prototype.shift.call(arguments), // 取出消息类型
fns = this.clientList[key]; // 取出该消息时对应的回调函数集
if(!fns || fns.length === 0 ){ return false;}
for(var i = 0 ,fn;fn = fns[i++];){
fn.apply(this,arguments)
}
}
}
// 定义一个installEvent函数，这个函数可以给所有的对象都动态安装发布-订阅功能
var installEvent = function(obj){
for(var i in event){
obj[i] = event[i]
}
}
var salesOffices = {}
installEvent(salesOffices)
salesOffices.listen('squareMeter88',function(price){
console.log(price)
})
salesOffices.listen('squareMeter100',function(price){
console.log(price)
})
salesOffices.trigger('squareMeter88',2000000)
salesOffices.trigger('squareMeter100',3000000)
