構成：   策略類、環境類 作用：   替換掉 if-else語句 應用場景舉例：   根據不同的情況，要呼叫不同的策略方法，如表單各種規則校驗   基本形式 - Javascript寫法 策略類

strategies = {
  S(salary) {
  return salary * 2;
  },
  A(salary) {
  return salary * 3;
  },
  B(salary) {
  return salary * 4;
  },
};

 

環境類 知道呼叫哪個策略（函式名），策略（函式）所需入參

const calculateBonus = function(level, salary) {
  
 
return stategies[level](salary);
};

 

工作中遇到過策略模式 在api.js中定義各種axios請求 - 策略類 在util.js中定義ajax()方法 - 環境類 其中環境類的入參，ajax(axiosMethodName, axiosMethodParams, otherParamsForConfig) 其作用在於，在ajax中封裝一些統一的Toast提示，不同的場合要用不同定義的axios方法，各方法具備不同的入參。   策略模式在表單校驗中的應用 先定義表單校驗函式

const stategies = {
  isNotEmpty(value, errorMsg) {
    ...
  },
  minLength(value, length, errorMsg) {
    ...
  },
};

 

由於會新增多條規則，因此把所有的規則都要先存起來，再一起呼叫

const Validator = function() {
  this.cache = []
};
 

 

相對於之前例子不同的是，這裡先用個function將策略存起來，而非直接呼叫，本質上來說，還是憑藉：1、策略名；2、策略引數  來進行呼叫，表單校驗會涉及到dom操作，因此策略引數中還包含了dom節點。

Validator.prototype.add = function(dom, rule, errorMsg) {
  rule === [規則名（即呼叫的策略名稱）, 策略引數];
  this.cache.push(function() {
    分別取出rule的引數
    return strategies[規則名].apply(dom, arg);
  });
};

 

呼叫的時候，則遍歷所有快取的規則，逐一呼叫

Validator.prototype.start = function() {
  遍歷this.cache，執行所有存入的校驗規則
}

 

參考文獻：

[1] 《JavaScript設計模式與開發時間》，曾探，中國工信出版集團.