JavaScript復雜判斷邏輯寫法是什么

這篇文章給大家分享的是有關JavaScript復雜判斷邏輯寫法是什么的內容。小編覺得挺實用的，因此分享給大家做個參考。一起跟隨小編過來看看吧。

在某些場景中，我們可能會遇到多個判斷條件的情況，針對這種情況，我們通常 會使使用if/else/switch來進行處理，但是多個判斷下，這樣的寫法會有很多的代碼，如何解決呢，請繼續往下看

首先我們拿if/esle舉個栗子，switch寫法我就不再這寫了

checkStatus(status) {
 if (status == 1) {
    function1();
  } else if (status == 2) {
    function2();
  } else if (status == 3) {
    function3();
  } else if (status == 4) {
    function4();
  } else if (status == 5) {
    function5();
  }
}

通過判斷不同的status，執行不同的方法，這是很常見的寫法，缺點是代碼量很多，且不利于可讀性，別人來維護的時候，不能快速的知道這個方法有多少個判斷條件，需要調用多少個方法。必須要看完整個方法，才知道這些。下面就介紹些更優化的方法，本文針對vue寫法

const actions = {
  '1': 'function1',
  '2': 'function2',
  '3': 'function3',
  '4': 'function4',
  '5': 'function5'
 }
 function checkStatus(status) {
   let action = actions[status];
  this[action]()
 }

這種寫法將方法名和需要判斷的類型值進行綁定，調用的時候通過屬性名找到對應的屬性值即可調用對應的方法，寫法簡單明了。我們在擴展下，假如類型為1的時候，我們不止要調用一種方法怎么辦，請看下面：

const actions = {
 '1': ['function1','function2'],
 '2': ['function3','function4'],
 '3': ['function5','function6'],
}

我們可以將類型為1時，需要調用的方法，寫在數組里面，那么調用的時候就可以這么拿：

function checkStatus(status) {
  let action = actions[status];
   this[action[0]]()
  this[action[1]]()
 }

以上兩種方法，是針對一元判斷的時候使用的，具體使用看具體的場景。
假如是多元判斷呢？例如，在判斷status為1的時候，我們還需要判斷type值為否為1等等。。。
條件對應為

if (status == 1 && type == 1) {
    //do someThing
} else if (status == 2 && type == 2) {
   //do someThing
} else if (status == 3 && type == 3) {
   //do someThing
} else if (status == 4 && type == 4) {
   //do someThing
} else if (status == 5 && type == 5) {
   //do someThing
}

這種業務場景下，如果是用傳統的if/else,代碼量簡直不敢想，接下來，看怎么優化這種情況

  const actions = new Map([
   [{type:'1',status:1},()=>{/*do sth*/}],
   [{type:'2',status:2},()=>{/*do sth*/}],
   //...
  ])

  function checkStatus(type,status)=>{
   let action = [...actions].filter(([key,value])=>(key.type == type && key.status == status))
   action.forEach(([key,value])=>value.call(this))
  }

這里需要解釋的一點是，Map可以用任何類型的數據作為key。我們可以直接判斷key是否符合我們的條件，對應的處理方法，可以寫在對應的vulue值里面。這種寫法基本能滿足大部分判斷邏輯了。。。下面將難度升級下。。。
上面我們講到type和status 都是一對一對應的情況下執行相應的方法，加入type為1時，ststus為2和3 都需要執行相同的方法，type為2時，status為1，2也需要執行相同的方法呢？上面的方法也可以使用，下面這樣：

const actions = new Map([
  [{type:'1',status:2},()=>{functionA}],
  [{type:'3',status:3},()=>{/functionB}],
  [{type:'2',status:1},()=>{functionC}],
  [{type:'1',status:3},()=>{functionA}],
  //...
 ])

這樣寫已經能滿足日常需求了，但上面重寫了2次status為2的情況還是有點不爽，假如判斷條件變得特別復雜，比如type有3種狀態，status有10種狀態，那你需要定義30條處理邏輯，而往往這些邏輯里面很多都是相同的，再用上面的寫法似乎很難接受，那么可以這么寫：

  const actions = ()=>{
   const functionA = ()=>{/*do sth*/}
   const functionB = ()=>{/*do sth*/}
   const functionC = ()=>{/*send log*/}
   return new Map([
   [/^1_[1-4]$/,functionA],
   [/^2_.*$/,functionC], 
   //...
   ])
  }

  function checkStatus(type,status)=>{
   let action = [...actions()].filter(([key,value])=>(key.test(`${type}_${status}`)))
   action.forEach(([key,value])=>value.call(this))
  }

也就是說利用數組循環的特性，符合正則條件的邏輯都會被執行，那就可以同時執行公共邏輯和單獨邏輯，因為正則的存在，你可以打開想象力解鎖更多的玩法,不懂ES6Map特性，可以去了解下，上面的用法對于大量的判斷邏輯來說，的確是優化了很多了。

感謝各位的閱讀！關于JavaScript復雜判斷邏輯寫法是什么就分享到這里了，希望以上內容可以對大家有一定的幫助，讓大家可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！