Heim > Artikel > Web-Frontend > JavaScript-Techniken zum Schreiben komplexer Urteilslogiken
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 entsprichtfunction 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 }
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. .
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!