js设计模式之策略模式

一、应用场景

策略模式是将一系列行为类似的功能和逻辑封装，将逻辑的使用和逻辑的实现分离。常用的场景如根据输入类型的不同，进行不同的计算，然后返回对应的结果。如银行的评估体系，某个人信誉度良好，则贷款额度为120%，一般为100%，不好为80%（这里只是举一个简单的例子）。

策略模式的代码可简单分为两部分，第一个部分是策略类，封装了具体的逻辑，负责功能的实现。第二个部分是环境类，负责使用场景的区分，然后调用对应的策略。核心思想就是：定义并封装一个个方法，使它们可以相互替换。

二、示例

通常，环境是已知的，所以，策略类的部分其实可以预定义，通常写法是写成一个键值对的东西，也就是对象。个人在开发中习惯称之为配置对象。不同的功能有不同的配置对象，所以在开发时（以常见的vue项目为例），每个模块除了.vue、.js/.ts、.css/.less之外，还有一个config.js/.ts文件，定义这个模块需要用到的配置对象。

我在开发中曾经有过这么个需求，用户手动选择一些字段，然后选择他需要的图表类型，界面上实时根据数据和图表类型做更新。用的图表框架是fusionchart，不同图表对应的数据结构不同，所以需要封装一个方法根据图表类型，对数据做不同的处理。

以下是简单的实现。核心思想就是策略模式，即，将功能封装成一个个方法，然后通过一个统一的调用方式，根据条件去决定执行什么方法

const handleColumnData = data => {
  //handle
};
const handleBarData = data => {
  //handle
};
const handleMapData = data => {
  //handle
};
const handleAreaData = data => {
  //handle
};
const handleLineData = data => {
  //handle
};

const chartDataHandle = {
  column: handleColumnData,
  bar: handleBarData,
  map: handleMapData,
  area: handleAreaData,
  line: handleLineData
};
const getChartDataByType = (type, data) => {
  return chartDataHandle[type](data);
};

同时，具体的方法可以用其他设计模式去做拆分，比如组合模式，单例模式等等。重要的不是具体的代码，而是思想，即：将具体的功能和对应的条件（环境）拆分，建立一一对应的关系，然后在一个统一的地方去做调用。