javascript - 狀態模式 - 簡化分支判斷流程

狀態模式筆記
   當一個對象的內部狀態發生改變時，會導致行為的改變，這像是改變了對象
   狀態模式既是解決程式中臃腫的分支判斷語句問題，將每個分支轉化為一種狀態獨立出來，方便每種狀態的管理又不至於每次執行時遍歷所有分支
   主要目的：將條件判斷的不同結果轉化為狀態對象的內部狀態，既然是狀態對象的內部狀態，所以作為狀態對象內部的私有變數，然後提供一個能夠調用狀態對象內部狀態的介面方法對象。
   最終目的：簡化分支判斷流程
   當有許多判斷時，如果用if或者switch條件判斷語句來寫，是很難維護的，因為增加或刪除一個條件需要改動的地方太多了
   其次組合條件用if或switch分支判斷實現，無形中增加的成本是無法想象的。

狀態類

 1             //狀態類
 2             var State = function(){
 3                 var _currentState = {},
 4                 states = {
 5                     one : function(){
 6                         console.log("狀態one");
 7                     },
 8                     two : function(){
 9                         console.log("狀態two");
10                     },
11                     three : function(){
12                         console.log("狀態three");
13                     },
14                     four : function(){
15                         console.log("狀態four");
16                     },
17                     five : function(){
18                         console.log("狀態five");
19                     }
20                 };
21                 //控制類
22                 var Action = {
23                     changeState : function(){
24                         //組合動作由多個參數實現
25                         var arg = arguments;
26                         //重置內部狀態
27                         _currentState = {};
28                         if(arg.length){
29                             for(var i=0, len = arg.length; i < len; i++){
30                                 //從內部狀態添加動作
31                                 _currentState[arg[i]] = true;
32                             }
33                         }
34                         return this;
35                     },
36                     goes : function(){
37                         //遍歷內部狀態保存的動作
38                         for(var i in _currentState){
39                             //如果該動作就執行
40                             states[i] && states[i]();
41                         }
42                         return this;
43                     }
44                 }
45                 return {
46                     change : Action.changeState,
47                     goes : Action.goes
48                 }
49             }

兩種方式執行這個狀態類

  1. 函數方式

1 State().change('one','three').goes().goes().change('two').goes();

  2. 實例化類

1             var state = new State();
2             state.change('one','three').goes().goes().change('two').goes();

控制台顯示