设计模式——策略模式

「这是我参与2022首次更文挑战的第1天，活动详情查看：2022首次更文挑战」

定义

定义一系列的算法，把它们一个个封装起来，并且使它们能相互替换。

‘策略’顾名思义，在不同条件下，执行不同的算法程序。

简单的加减乘除

// 加减乘除
function computed(type, num1, num2) {
    if (type === 'add') {
        return num1 + num2;
    }
    if (type === 'sub') {
        return num1 - num2;
    }
    if (type === 'mul') {
        return num1 * num2;
    }
    if (type === 'div') {
        return num1 / num2;
    }
}

把代码写成这样，看似没什么问题，但是对以后的扩展非常不利。

比如：要新加一个取余的方法。我们必须去修改computed中的内容，才能实现功能。而真实项目中逻辑很复杂，修改带有逻辑的函数是非常危险的。

这样做怎么样？

// 加减乘除
const computedType = {
    add: (num1, num2) => {
        return num1 + num2;
    },
    sub: (num1, num2) => {
        return num1 - num2;
    },
    mul: (num1, num2) => {
        return num1 * num2;
    },
    div: (num1, num2) => {
        return num1 / num2;
    },
}
function computed(type, num1, num2) {
    computedType[type](num1, num2);
}

我们把这个功能分成了逻辑层computed和配置层computedType两部分，分层的好处在于之后扩展新功能，不需要更改逻辑层的代码，只需要在配置层增加：

rem: (num1, num2) => {
    return num1 % num2;
},

就可以使用取余数的功能。

其他例子

加减乘除是非常简单的例子，主要是为了方便大家理解。真实的项目开发中会有很多复杂的场景。

1. 出行选择：飞机、车、船；
2. 后端返回status，前端根据status渲染不同的视觉；
3. 实现一个小球，上下左右的滚动，上下左右行为可以使用策略模式定义。
4. ... ... 使用场景很多，灵活运用能让我们的代码质量更高，可维护度更高。

总结

策略模式可以说是设计模式中最常见的，其他模式都会在做封装时采用。而策略模式体现在开发过程中细小的设计，让整个程序充满设计的感觉，而又不会设计过度。