设计模式之策略模式

一、基础介绍

策略模式：定义一系列算法，把它们一个个封装起来，并且使它们可以互相替换。

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

• Strategy
  第一部分是一组策略类，封装了具体的算法，并负责具体的计算过程。
• Context
  第二部分是环境类 Context， 接受客户的请求，随后把请求委托给某一个策略类。

策略模式的 UML 类图

二、例子讲解

现有如下需求，支付功能需要对接多个第三方平台，如支付宝、微信、招商银行等，每个第三方平台可自由设置配置项，注意以后会有新的平台加入。

先来段错误示范的伪代码：

funtion pay(type) {
  if (type === 'wx') {
    // 进行微信的配置型
  }
  if (type === 'ali') {
    // 进行支付宝的配置型
  }
  if (type === 'zs') {
    // 进行招商的配置型
  }
}

这种的写法的缺点在于：

• 随着要对接的平台越来越多， if 语句会明显增多。
• 缺乏扩展性，每次新增平台，需要修改 pay 函数的内部实现。

策略模式的目的就是将算法的调用和算法的实现分离开来。
在这里例子中，仔细分析开发现：

• 不变的部分
  每个平台都需要设置配置项。
• 变化的部分
  设置配置型的具体实现是不同的。

const plateforms = {
  'wx': {
    config: {
      wxPay: ''
    },
    setConfig() {
      this.config.wxPay = 'wx';
      console.log(this.config);
    }
  },
 'ali': {
    config: {
      aliPay: ''
    },
    setConfig() {
      this.config.aliPay = 'ali';
      console.log(this.config);
    }
  },
 'zs': {
    config: {
      zsPay: ''
    },
    setConfig() {
      this.config.zsPay = 'zs';
      console.log(this.config);
    }
  }
}

function pay(type) {
  plateforms[type].setConfig();
}

重构之后，将代码分为两部分，plateforms 代表着策略类(方法的具体实现)，pay 代表着环境类 (方法的调用)。

当以后有新的平台需要对接时，新增一个策略类即可，不用改动 pay 函数。

运行示例

三、应用场景

缓动动画、表单校验。

四、优缺点

优点：

• 避免多重条件分支语句
• 算法复用
• 开放-封闭原则

缺点：

• 必须了解所有的策略类的实现

参考

《JavaScript 设计模式与开发实践》曾探
《JavaScript 设计模式》张容铭
Javascript设计模式系统讲解与应用