Einfachere if-Anweisungen bedeuten immer saubereren JavaScript-Code.

Bedingte Anweisungen sind ein wesentlicher Bestandteil von JavaScript. Mit ihnen können Sie Code basierend darauf ausführen, ob eine bestimmte Bedingung wahr oder falsch ist, und Sie können mehrere verschachteln sonst Aussagen (und ein anders), um mehr als eine Bedingung auszuwerten.

Aber hier ist das Problem – wenn man komplex schreibt ansonsten Ketten können die Dinge schnell unordentlich werden, und Sie können leicht mit Code enden, der schwer zu lesen und zu verstehen ist.

Lassen Sie uns lernen, wie man lange und komplexe umgestaltet wenn... sonst... sonst Bedingungsketten in eine prägnantere, sauberere und leichter verständliche Version.

Komplexe if...else-Ketten

Beim Schreiben komplexer if...else-Anweisungen in JavaScript ist es wichtig, dass Sie schreiben sauberer, prägnanter und verständlicher Code. Werfen Sie zum Beispiel einen Blick auf die ansonsten Bedingungskette innerhalb der folgenden Funktion:

Funktionkann trinken(Person) 





instagram viewer

{
Wenn(Person?.Alter != Null) {
Wenn(Person.Alter < 18) {
Konsole.Protokoll(„Noch zu jung“)
 } andersWenn(Person.Alter < 21) {
Konsole.Protokoll("Nicht in den USA")
 } anders {
Konsole.Protokoll(„Trinken erlaubt“)
 }
 } anders {
Konsole.Protokoll("Du bist kein Mensch")
 }
}
konst Person = {
 Alter: 22
}
canDrink (Person)

Die Logik hier ist einfach. Der erste Wenn Anweisung stellt sicher, dass die Person Objekt hat eine Alter Eigentum (andernfalls ist er oder sie keine Person). Darin Wenn Block, Sie haben eine hinzugefügt wenn... sonst... wenn Kette, die im Grunde sagt:

Wenn die Person jünger als 18 ist, ist sie zu jung, um etwas zu trinken. Wenn sie jünger als 21 Jahre sind, liegen sie immer noch unter dem gesetzlichen Mindestalter für Alkoholkonsum in den Vereinigten Staaten. Andernfalls können sie sich legal ein Getränk besorgen.

Obwohl der obige Code gültig ist, macht es die Verschachtelung für Sie schwieriger, den Code zu verstehen. Glücklicherweise können Sie den Code so umgestalten, dass er prägnant und leichter lesbar ist, indem Sie a verwenden Schutzklausel.

Guard-Klauseln

Immer wenn Sie eine haben Wenn -Anweisung, die Ihren gesamten Code umschließt, können Sie a verwenden Schutzklausel um alle Verschachtelungen zu entfernen:

FunktioncanDrinkBetter() {
Wenn(Person?.Alter == Null) zurückkehrenKonsole.Protokoll("Du bist kein Mensch") 
Wenn(Person.Alter < 18) {
Konsole.Protokoll(„Noch zu jung“)
 } andersWenn(Person.Alter < 21) {
Konsole.Protokoll("Nicht in den USA")
 } anders {
Konsole.Protokoll(„Trinken erlaubt“)
 }
}

Zu Beginn der Funktion haben Sie eine Schutzklausel definiert, die besagt, dass Sie die verlassen möchten, wenn diese bestimmte Bedingung nicht erfüllt ist canDrinkBetter() sofort funktionieren (und "You're not a person" auf der Konsole melden).

Aber wenn die Bedingung erfüllt ist, werten Sie die aus ansonsten Kette, um zu sehen, welcher Block anwendbar ist. Wenn Sie den Code ausführen, erhalten Sie das gleiche Ergebnis wie im ersten Beispiel, aber dieser Code ist einfacher zu lesen.

Verwenden Sie keine einzelne Rückgabe

Sie könnten argumentieren, dass die obige Technik keine ist Gutes Programmierprinzip weil wir mehrere Rückgaben in derselben Funktion verwenden und Sie der Meinung sind, dass es besser ist, nur eine Rückgabeerklärung (auch bekannt als einzelne Rückgaberichtlinie) zu haben.

Aber das ist eine schreckliche Art, Code zu schreiben, weil es Sie in die gleichen verrückten Verschachtelungssituationen zwingt, die wir im ersten Codebeispiel gesehen haben.

Damit können Sie mehrere verwenden zurückkehren Anweisungen, um Ihren Code weiter zu vereinfachen (und die Verschachtelung loszuwerden):

FunktioncanDrinkBetter() {
Wenn(Person?.Alter == Null) zurückkehrenKonsole.Protokoll("Du bist kein Mensch") 
Wenn(Person.Alter < 18) {
Konsole.Protokoll(„Noch zu jung“)
zurückkehren
 } 


Wenn(Person.Alter < 21) {
Konsole.Protokoll("Nicht in den USA")
zurückkehren
 }
Konsole.Protokoll(„Trinken erlaubt“) 
}

Dieser Code funktioniert genauso wie die beiden vorherigen Beispiele und ist auch etwas sauberer.

Extrahieren Sie Funktionen für saubereren Code

Unser letzter Codeblock war sauberer als die ersten beiden, aber er ist immer noch nicht so gut, wie er sein könnte.

Anstatt lange zu haben ansonsten Kette innerhalb einer Funktion, können Sie eine separate Funktion erstellen canDrinkResult() das führt die Überprüfung für Sie durch und gibt das Ergebnis zurück:

FunktioncanDrinkErgebnis(Alter) {
Wenn(Alter < 18) zurückkehren„Noch zu jung“
Wenn(Alter < 21) zurückkehren"Nicht in den USA"
zurückkehren„Trinken erlaubt“
}

Dann müssen Sie innerhalb der Hauptfunktion zunächst nur die Schutzklausel anwenden, bevor Sie die aufrufen canDrinkResult() Funktion (mit dem Alter als Parameter), um das Ergebnis zu erhalten:

FunktioncanDrinkBetter() { 
Wenn(Person?.Alter == Null) zurückkehrenKonsole.Protokoll("Du bist kein Mensch") 
lassen result = canDrinkResult (Person.Alter)
Konsole.log (Ergebnis)
}

In diesem Fall haben Sie also die Überprüfung des Trinkalters an eine separate Funktion delegiert und diese nur bei Bedarf aufgerufen. Dadurch wird Ihr Code prägnanter und einfacher zu handhaben als alle vorherigen Beispiele.

Halten Sie andere von bedingten Anweisungen fern

Sie haben gelernt, wie Sie komplexe, verschachtelte Bedingungsketten mithilfe von Schutzklauseln und der Technik der Funktionsextraktion in kürzere, leichter lesbare umgestalten können.

Versuchen Sie, die zu halten anders Anweisung so weit wie möglich von Ihren Bedingungen entfernt, indem Sie sowohl Schutzklauseln als auch die Technik der Funktionsextraktion verwenden.

Wenn Sie noch neu in der Verwendung von JavaScript sind ansonsten Aussage, beginnen Sie mit den Grundlagen.