策略模式

主要思想

定义一系列的算法，把它们一个个封装起来，通过逻辑函数使他们可以相互替换
避免if-else多分支判断

具体实现

定义一些系列算法（具体处理过程），把他们各自封装成策略类，算法被封装在策略类内部方法里。在客户对Context(如何调用算法的处理函数)发起请求时，Context总是把请求委托给这些策略对象中间的某一个进行计算

注意点

编写代理函数时，注意如何调用，让算法得到执行

let strategies = { //算法集合
	 "S": function( salary ){ 
        return salary * 4;     
		},
     "A": function( salary ){
         return salary * 3;
     },
     "B": function( salary ){
         return salary * 2;
     }
 }; 
var calculateBonus = function( level, salary ){ //Context,委托函数，负责调用哪个算法
     return strategies[ level ]( salary ); 
};
 
console.log( calculateBonus( 'S', 20000 ) );//80000
console.log( calculateBonus( 'A', 10000 ) );//30000

变形：
var S = function( salary ){      return salary * 4;  }; 
var A = function( salary ){     return salary * 3; }; 
var B = function( salary ){     return salary * 2; }; 
var calculateBonus = function( func, salary ){     return func( salary ); }; 
calculateBonus( S, 10000  )

//具体策略方法
 var strategies = {             
     isNonEmpty: function( value, errorMsg ){                 
         if ( value === '' ){                     
             return errorMsg;                 
        }             
    },             
    minLength: function( value, length, errorMsg ){                 
        if ( value.length < length ){                     
            return errorMsg;                 
        }             
    },             
    isMobile: function( value, errorMsg ){                 
        if ( !/(^1[3|5|8][0-9]{9}$)/.test( value ) ){                     
            return errorMsg;                 
        }             
    }         
}; 
//执行代理 Context
 var Validator = function(){             
        this.cache = [];         
     }; 

    Validator.prototype.add = function( dom, rules ){ 
        var self = this;
        for ( var i = 0, rule; rule = rules[ i++ ]; ){                 
            (function( rule ){                     
                var strategyAry = rule.strategy.split( ':' );                     
                var errorMsg = rule.errorMsg; 
                self.cache.push(function(){                         
                    var strategy = strategyAry.shift(); 
                    strategyAry.unshift( dom.value );                       
                    strategyAry.push( errorMsg ); //strategyAry，传递到具体算法函数参数，这里进行处理          
                    return strategies[ strategy ].apply( dom, strategyAry );                     
                });                 
            })( rule )             
        } 
    }; 
    Validator.prototype.start = function(){             
        for ( var i = 0, validatorFunc; validatorFunc = this.cache[ i++ ]; ){                 
            var errorMsg = validatorFunc();                 
            if ( errorMsg ){                     
                return errorMsg;                 
            }             
        }         
    };
//具体应用
    var registerForm = document.getElementById( 'registerForm' ); 
    var validataFunc = function(){             
        var validator = new Validator(); 
        validator.add( registerForm.userName, [{                 
            strategy: 'isNonEmpty',                 
            errorMsg: '用户名不能为空'             
        }, {                 
            strategy: 'minLength:6',                
            errorMsg: '用户名长度不能小于 10 位'             
        }]); 
        validator.add( registerForm.password, [{                 
            strategy: 'minLength:6',                 
            errorMsg: '密码长度不能小于 6 位'             
        }]); 
        validator.add( registerForm.phoneNumber, [{                 
            strategy: 'isMobile',                 
            errorMsg: '手机号码格式不正确'             
        }]); 
        var errorMsg = validator.start();             
        return errorMsg;         
    } 
    registerForm.onsubmit = function(){                  
        var errorMsg = validataFunc(); 
        if ( errorMsg ){                   
            alert ( errorMsg );                   
            return false;              
        }
    }