策略模式-前端设计模式

策略模式
解决代码里面的 if else 的堆叠

不同策略，分开处理，而不是混合在一起
符合开放封闭原则

		class User {
            constructor(type) {
                this.type = type
            }
            buy() {
                if (this.type === "ordinaryUser") {
                    console.log('普通用户购买');
                } else if (this.type === "memberUser") {
                    console.log('会员用户购买');
                } else if (this.type === "vipUser") {
                    console.log('VIP用户购买');
                }
            }
        }
        let u1 = new User("ordinaryUser")
        u1.buy()
        let u2 = new User("memberUser")
        u2.buy()
        let u3 = new User("vipUser")
        u3.buy()

改造成下面的代码

 		class ordinaryUser {
            buy() {
                console.log('普通用户购买');
            }
        }

        class memberUser {
            buy() {
                console.log('会员用户购买');
            }
        }

        class vipUser {
            buy() {
                console.log('VIP用户购买');
            }
        }

        let u1 = new ordinaryUser()
        u1.buy()
        let u2 = new memberUser()
        u2.buy()
        let u3 = new vipUser()
        u3.buy()

有下面的一个使用场景
根据表现的等级 计算年终奖
下面的这段代码是不美观的，如果等级太多了，会一直添加 if else 可读性很差

// 根据表现的等级  计算年终奖
        let getBonus = function(level, salary) {
            if(level === 's') {
                return salary*4
            } else if(level === 'a') {
                return salary*3
            } else if(level === 'b') {
                return salary*2
            }
        }

        let res = getBonus('b', 10000) 
        console.log(res);

策略模式的写法

       // 策略类
		let state = {
            's': function(salary) {
                return salary*4
            },
            'a': function(salary) {
                return salary*3
            },
            'b': function(salary) {
                return salary*2
            }
        }

		// 环境类
        let getBonus = function(key, m) {
            return state[key](m)

        }

        let res = getBonus('a', 1000)
        console.log(res);

我将上面的代码修改了一下
可能有人觉得没有必要这样处理
将每一个等级写成类，我需要该倍数的时候，直接找到等级的类就可以了
我做的这一层，是将数据的处理抽离了出来，更好理解一些。

		class S {
            salary(salary) {
                return salary * 4
            }
        }

        class A {
            salary(salary) {
                return salary * 3
            }
        }

        class B {
            salary(salary) {
                return salary * 2
            }
        }


        let state = {
            's': function (salary) {
                let s = new S()
                return s.salary(salary)
            },
            'a': function (salary) {
                let a = new A()
                return a.salary(salary)
            },
            'b': function (salary) {
                let b = new A()
                return b.salary(salary)
            }
        }

        let getBonus = function (key, m) {
            return state[key](m)

        }

        let res = getBonus('a', 1000)
        console.log(res);