把不變的部分和變化的部分隔開是每個設計模式的主題。
- 條條大路通羅馬。我們經常會遇到解決一件事情有多種方案，比如壓縮文件，我們可以使用zip算法、也可以使用gzip算法。其靈活多樣，我們可以采用策略模式解決。
一、定義
定義一系列的算法，把它們一個個封裝起來，并且使它們可以相互替換。
基于策略類模式的程序至少由兩部分組成。第一個部分是一組策略類，策略類封裝了具體的算法，并負責具體的計算過程。第二個部分是環境類Context，Context接收客戶的請求，隨后把請求委托給某一個策略類。
二、示例
計算獎金。績效為S的發放4倍工資，績效為A的發放3倍工資，績效為B的發放2倍工資。
var strategies = { "S": function(salary) { return salary * 4; }, "A": function(salary) { return salary * 3; }, "B": function(salary) { return salary * 2; }};// 接收請求var calculateBonus = function(level, salary) { return strategies[level](salary);};// 測試console.log(calculateBonus("S", 20000));console.log(calculateBonus("A", 20000));console.log(calculateBonus("B", 20000)); 三、延伸：表單驗證
/* 校驗策略對象 */var validateStrategies = { isEmpty: function (val, errorMsg) { if (!val) { return errorMsg; } }, isURL: function (val, errorMsg) { if (!new RegExp("^(http://////|https://////)?([//w//-]+//.)+[//w//-]+(///[//w//-//.///?//@//%//!//&=//+//~//://#//;//,]*)?$").test(val)) { return errorMsg; } }, isEmail: function (val, errorMsg) { if (!new RegExp('//w+((-//w+)|(//.//w+))*//@[A-Za-z0-9]+((//.|-)[A-Za-z0-9]+)*//.[A-Za-z0-9]+').test(val)) { return errorMsg; } }, isMaxLength: function (val, length, errorMsg) { if (val.length > length) { return errorMsg; } }, isMinLength: function (val, length, errorMsg) { if (val.length < length) { return errorMsg; } }};/* validator類 */var validator = function () { // 緩存驗證策略 this.cache = [];};/** * 添加要驗證的策略 * @param dom 要驗證的dom元素 * @param rules 驗證規則 */validator.prototype.add = function (dom, rules) { var self = this; for (var i = 0, rule; rule = rules[i++];) { (function (rule) { var strategyAry = rule.strategy.split(":"); // ["isMaxLength", "10"] var errorMsg = rule.errorMsg; // "內容長度不能超過10" self.cache.push(function () { var strategy = strategyAry.shift(); // "isMaxLength" strategyAry.unshift(dom.value); // ["1@qq", "10"] strategyAry.push(errorMsg); // ["1@qq", "10", "內容長度不能超過10"] return validateStrategies[strategy].apply(dom, strategyAry); }); })(rule); }};/* 開始校驗 */validator.prototype.start = function () { for (var i = 0, validateFunc; validateFunc = this.cache[i++];) { var errorMsg = validateFunc(); if (errorMsg) { return errorMsg; } }};// 測試<label for="email">郵箱：</label><input type="text" name="email" value="1@qq">var validatorInstance = new validator();validatorInstance.add( document.getElementsByName("email")[0], [{ strategy: "isEmpty", errorMsg: "內容不能為空" },{ strategy: "isMaxLength:10", errorMsg: "內容長度不能超過10" },{ strategy: "isEmail", errorMsg: "email格式不對" }]);errorMsg = validatorInstance.start(); 希望本文所述對大家學習javascript程序設計有所幫助。
