Heim  >  Artikel  >  Web-Frontend  >  JavaScript-Techniken zum Schreiben komplexer Urteilslogiken

JavaScript-Techniken zum Schreiben komplexer Urteilslogiken

不言
不言nach vorne
2019-03-05 14:25:082505Durchsuche

Der Inhalt dieses Artikels befasst sich mit Schreibtechniken für komplexe Beurteilungslogik in JavaScript. Er hat einen gewissen Referenzwert. Ich hoffe, dass er für Sie hilfreich ist.

In einigen Szenarien können wir auf mehrere Beurteilungsbedingungen stoßen. In diesem Fall verwenden wir normalerweise if/else/switch für die Verarbeitung, aber bei mehreren Beurteilungen wie diesem wird eine Menge Code im Weg stehen Schreiben. Wie kann ich es lösen? Bitte lesen Sie weiter unten. Nehmen wir zunächst if/esle als Beispiel. Ich werde die Switch-Schreibmethode nicht noch einmal schreiben Durch die Beurteilung unterschiedlicher Status werden unterschiedliche Methoden ausgeführt. Der Nachteil besteht darin, dass die Menge an Code groß ist und die Lesbarkeit nicht förderlich ist Beurteilungsbedingungen dieser Methode, wie viele Methoden aufgerufen werden müssen. Um dies zu wissen, müssen Sie die gesamte Methode lesen. Hier sind einige weitere optimierte Methoden. Dieser Artikel konzentriert sich auf die Vue-Schreibmethode

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();
  }
}

. Diese Schreibmethode bindet den Methodennamen an den zu beurteilenden Typwert Attributnamen und rufen Sie die entsprechende Methode auf. Die Methode ist einfach und klar geschrieben. Was ist, wenn wir unter unserer Erweiterung mehr als eine Methode aufrufen müssen, wenn der Typ 1 ist? Bitte sehen Sie unten:

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

Wir können die Methoden schreiben, die aufgerufen werden müssen, wenn der Typ 1 im Array ist. , dann können Sie es beim Aufruf wie folgt verwenden:

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

Die beiden oben genannten Methoden werden für die Ein-Yuan-Beurteilung verwendet. Die spezifische Verwendung hängt vom jeweiligen Szenario ab.

Was ist, wenn es sich um ein Mehrfachurteil handelt? Wenn wir beispielsweise den Status als 1 beurteilen, müssen wir auch beurteilen, ob der Typwert 1 ist und so weiter. . .

Die Bedingung entspricht

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

Wenn Sie in diesem Geschäftsszenario das traditionelle if/else verwenden, ist die Menge an Code unvorstellbar. Sehen wir uns als Nächstes an, wie Sie diese Situation optimieren können

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
}

Hier muss erklärt werden, dass Map jede Art von Daten als Schlüssel verwenden kann. Wir können direkt feststellen, ob der Schlüssel unsere Bedingungen erfüllt, und die entsprechende Verarbeitungsmethode kann in den entsprechenden Vulue-Wert geschrieben werden. Diese Schreibweise kann grundsätzlich die meisten Urteilslogiken erfüllen. . . Der Schwierigkeitsgrad wird unten erhöht. . .
Wir haben oben erwähnt, dass die entsprechende Methode ausgeführt wird, wenn Typ und Status eins zu eins übereinstimmen. Wenn Typ 1 ist, ist ststus 2 und 3, und beide müssen dieselbe Methode ausführen Müssen 1. und 2 auch dieselbe Methode ausführen? Die obige Methode kann auch wie folgt verwendet werden:

  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))
  }

Ein solches Schreiben kann bereits den täglichen Bedarf decken, aber es ist immer noch etwas unangenehm, den Status zweimal auf 2 umzuschreiben. Wenn die Beurteilungsbedingung besonders kompliziert wird. Beispielsweise hat der Typ 3 Zustände und der Status 10. Dann müssen Sie 30 Verarbeitungslogiken definieren, und oft sind viele dieser Logiken gleich. Es scheint schwierig, die obige Schreibmethode zu akzeptieren, also können Sie sie so schreiben:

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

Das heißt, unter Verwendung der Eigenschaften von Array-Schleifen wird Logik ausgeführt, die reguläre Bedingungen erfüllt. Aufgrund der Existenz regulärer Regeln können dann öffentliche Logik und individuelle Logik ausgeführt werden. Sie können Ihrer Fantasie freien Lauf lassen und weitere Spielmöglichkeiten freischalten. Wenn Sie die Funktionen von ES6Map nicht verstehen, können Sie die obige Verwendung in der Tat für eine große Menge an Beurteilungslogik optimieren. .

Ich hoffe, dass es in Zukunft mehr als nur if/else/switch geben wird. . . .

Das obige ist der detaillierte Inhalt vonJavaScript-Techniken zum Schreiben komplexer Urteilslogiken. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:csdn.net. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen