我爱编程

JavaScript设计模式三(策略模式)

2018-04-16  本文已影响0人  moyi_gg

JavaScript设计模式三(策略模式)

策略模式定义

定义一系列算法,把他们一个个封装起来,并且使他们相互替换

我们可以先看一个例子

策略模式计算年终奖

大家知道年终奖的发放是和工资基数和年终考评来计算的,例如A是4个月工资,B是3个月工资,C是2个月工资。

1、最初的代码实现

var calculateBonus = function(level, salary) {
    if (level === 'A') {
        return salary*4;
    }
    
    if (level === 'B') {
        return salary*3;
    }
    
    if (level === 'C') {
        return salary*2;
    }
}

使用方法:
calcaluteBonus('B', 10000)

这段代码平常我们见到的很多,但是它有着明显的缺点

2、利用组合函数重构代码

简单来解释,就是把那些算法封装到一个个函数里面。


var algorithmA = function(salary) {
    return salary*4;
}

var algorithmB = function(salary) {
    return salary*3;
}

var algorithmC = funtion(salary) {
    return salary*2;
}

var calculateBonus = function(level, salary) {
    if (level === 'A') {
        return algorithmA(salary);
    }
    
    if (level === 'B') {
        return algorithmB(salary*3);
    }
    
    if (level === 'C') {
        return algorithmC(salary*2);
    }
}

这么修改之后,这些算法我们可以在其他函数里面复用了,但是还是没有解决calculateBonus函数庞大的问题。

3、使用策略模式重构代码

一个策略模式的程序至少由两部分组成

我们先看一个模仿面向对象语言的实现:

// 策略类
var algorithmA = function(){}

algorithmA.prototype.calculate = function(salary) {
    return salary*4;
}

var algorithmB = function(){}

algorithmB.prototype.calculate = function(salary) {
    return salary*3;
}

var algorithmB = function(){}

algorithmB.prototype.calculate = function(salary) {
    return salary*2;
}

// 环境上下文

var Bonus = function(){
    this.salary = null;
    this.strategy = null;
}

Bonus.prototype.setSalary = function(salary) {
    this.salary = salary;
}

Bonus.prototype.setStrategy = function(strategy) {
    this.strategy = strategy;
}

Bonus.prototype.getBonus = function() {
    return this.strategy.calculate( this.salary );
}

// 使用

var bonus = new Bonus();

bonus.setSalary(10000);
bonus.setStrategy(new algorithmA());

console.log(bonus.getBonus());

刚才上面说到了面向对象的的实现,但是其实我们很少会这样写,我们看看JavaScript的版本

4、JavaScript版本的策略模式

var strategies = {
    "A": function(salary) {
        return salary*4;
    },
    "B": function(salary) {
        return salary*3;
    },
    "C": function(salary) {
        return salary*2;
    },
};

var calculateBonus = function(level, salary) {
    return strategies[level](salary);
};

calculateBonus('A', 10000);

惊不惊喜,意不意外,就是这么简单。

策略模式更加广义的用法

上面我们说的策略模式封装的是算法,但是实际上我们不仅仅可以封装算法,还可以封装一些业务规则,例如表单验证里面,我们可以封装不同的校验逻辑,这里就不举例说明了,如果有兴趣可以参考JavaScript设计模式与实践这本书

策略模式的优缺点

优点:

缺点:

上一篇下一篇

猜你喜欢

热点阅读