Maison  >  Article  >  interface Web  >  Techniques d'écriture de logique de jugement complexe JavaScript

Techniques d'écriture de logique de jugement complexe JavaScript

不言
不言avant
2019-03-05 14:25:082508parcourir

Le contenu de cet article concerne les techniques d'écriture pour une logique de jugement complexe en JavaScript. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Dans certains scénarios, nous pouvons rencontrer plusieurs conditions de jugement. Dans ce cas, nous utilisons généralement if/else/switch pour le traitement, mais sous plusieurs jugements, comme celui-ci, il y aura beaucoup de code dans la méthode d'écriture. .Comment le résoudre ? Veuillez continuer à lire ci-dessous

Tout d'abord, prenons if/esle comme exemple, je n'écrirai plus la méthode d'écriture 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();
  }
}
En jugeant différents statuts, différentes méthodes sont exécutées. C'est une façon d'écrire très courante. L'inconvénient est qu'il y a beaucoup de code et qu'il n'est pas propice à la lisibilité. Quand d'autres viennent le maintenir, ils ne peuvent pas savoir rapidement comment. il existe de nombreuses méthodes. Déterminez les conditions et le nombre de méthodes qui doivent être appelées. Vous devez lire toute la méthode pour le savoir. Voici quelques méthodes plus optimisées.Cet article se concentre sur la méthode d'écriture vue

const actions = {
  '1': 'function1',
  '2': 'function2',
  '3': 'function3',
  '4': 'function4',
  '5': 'function5'
 }
 function checkStatus(status) {
   let action = actions[status];
  this[action]()
 }
Cette méthode d'écriture lie le nom de la méthode à la valeur de type qui doit être jugée. Lors de l'appel, vous pouvez trouver la valeur correspondante. valeur d'attribut via le nom de l'attribut. Appelez la méthode correspondante, la méthode d'écriture est simple et claire. Sous notre extension, que se passe-t-il si nous devons appeler plus d'une méthode lorsque le type est 1, veuillez voir ci-dessous :

const actions = {
 '1': ['function1','function2'],
 '2': ['function3','function4'],
 '3': ['function5','function6'],
}
Nous pouvons écrire la méthode qui doit être appelée lorsque le type est 1, dans Dans le tableau, vous pouvez l'obtenir comme ceci lors de l'appel :

function checkStatus(status) {
  let action = actions[status];
   this[action[0]]()
  this[action[1]]()
 }
Les deux méthodes ci-dessus sont utilisées pour un jugement à un yuan. L'utilisation spécifique dépend du scénario spécifique.

Et s'il s'agit de jugements multiples ? Par exemple, lorsque nous jugeons le statut à 1, nous devons également déterminer si la valeur du type est 1 et ainsi de suite. . .
La condition correspond à

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
}
Dans ce scénario commercial, si vous utilisez le if/else traditionnel, la quantité de code est inimaginable. Voyons ensuite comment optimiser cette situation

Une chose qui doit être expliquée ici est que Map peut utiliser n'importe quel type de données comme clé. Nous pouvons déterminer directement si la clé répond à nos conditions, et la méthode de traitement correspondante peut être écrite dans la valeur vulue correspondante. Cette façon d'écrire peut fondamentalement satisfaire la plupart des logiques de jugement. . . La difficulté sera améliorée ci-dessous. . .
  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))
  }
Nous avons mentionné ci-dessus que la méthode correspondante est exécutée lorsque le type et le statut sont en correspondance biunivoque. Lorsque le type est 1, ststus est 2 et 3 et les deux doivent exécuter la même méthode. Lorsque le type est 2, status. est-ce que 1. , 2 doivent également exécuter la même méthode ? La méthode ci-dessus peut également être utilisée, comme suit :


Écrire ainsi peut déjà répondre aux besoins quotidiens, mais il est quand même un peu inconfortable de réécrire le statut 2 fois ci-dessus, si les conditions de jugement deviennent particulières Complexe. Par exemple, le type a 3 états et le statut a 10 états. Ensuite, vous devez définir 30 logiques de traitement, et souvent beaucoup de ces logiques sont les mêmes. Il semble difficile d'accepter la méthode d'écriture ci-dessus, vous pouvez donc écrire comme ceci. :
const actions = new Map([
  [{type:'1',status:2},()=>{functionA}],
  [{type:'3',status:3},()=>{/functionB}],
  [{type:'2',status:1},()=>{functionC}],
  [{type:'1',status:3},()=>{functionA}],
  //...
 ])

C'est-à-dire qu'en utilisant les caractéristiques des boucles de tableau, la logique qui répond aux conditions régulières sera exécutée. Ensuite, la logique publique et la logique individuelle pourront être exécutées en même temps. règles régulières, vous pouvez ouvrir votre imagination et en débloquer davantage. Il existe de nombreuses façons de jouer, et si vous ne comprenez pas les fonctionnalités d'ES6Map, vous pouvez en apprendre davantage. L'utilisation ci-dessus est en effet beaucoup optimisée pour une grande quantité de jugement. logique. .
  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))
  }

J'espère qu'il y aura plus que simplement if/else/switch dans le futur. . . .

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer