JS 4 super praktische Tipps zur Verbesserung der Entwicklungseffizienz

1. Kurzschlussurteil

Diese Methode kann verwendet werden, wenn nur eine einfache if-Bedingung erforderlich ist

sei x = 0;
let foo = () => console.log('ausgeführt');

wenn(x === 0){
  foo()
}

Die gleiche if-Funktion kann mit dem Operator && erreicht werden. Wenn die Bedingung vor && false ist, wird der Code nach && nicht ausgeführt.

sei x = 0;
let foo = () => console.log('ausgeführt');

x === 0 && foo()

Sie können auch weitere if-Bedingungen hinzufügen, dadurch erhöht sich jedoch auch die Komplexität der Anweisung. Es wird nicht empfohlen, mehr als zwei Bedingungen zu haben.

sei x = 0;
sei y = 0;
let foo = () => console.log('ausgeführt');

x === 0 && y === 0 && foo()

2. Optionaler Verkettungsoperator (?)

Wir prüfen häufig, ob in einem JS-Objekt ein key vorhanden ist, da wir manchmal nicht sicher sind, ob die von der Hintergrund-API zurückgegebenen Daten korrekt sind.

user Benutzerobjekt enthält ein Objekt mit dem Attribut name . name hat ein Attribut firstName . Wenn user.name.firstName zur direkten Beurteilung verwendet wird, wird ein Fehler gemeldet, wenn das Namensattribut nicht vorhanden ist. Daher muss vor der Beurteilung auch festgestellt werden, ob user.name vorhanden ist, was zwei Schichten verschachtelter if-Beurteilungen erfordert.

lass Benutzer = {
  Name : {
    Vorname: „Aofukaosi“
  }
}

if(Benutzername){
  if(Benutzer.Name.Vorname){
    console.log('Benutzerobjekt enthält das Feld Vorname')
  }
}

Zu diesem Zeitpunkt können wir den Operator ? verwenden, um den Vorgang zu vereinfachen. Wenn user.name nicht existiert, wird auch false zurückgegeben, sodass wir direkt eine Beurteilungsebene verwenden können.

lass Benutzer = {
  Name : {
    Vorname: „Aofukaosi“
  }
}

if(Benutzer.Name?.Vorname){
  console.log('Benutzerobjekt enthält das Feld Vorname')
}

3. Null-Koaleszenzoperator (??)

Im Vergleich zu if/else ist der ternäre Operator viel kürzer. Wenn die Logik einfach ist, ist sie bequem zu verwenden.

Zum Beispiel:

lass Benutzer = {
  Name : {
    Vorname: „Aofukaosi“
  }
}

lass foo = () => {
  Benutzername?.Vorname zurückgeben? 
    Benutzer.Name.Vorname: 
    „Vorname existiert nicht“
}

Konsole.log(foo())

Verwenden Sie zunächst den ?-Operator, um zu bestimmen, ob es vorhanden ist. Wenn es vorhanden ist, wird „false“ zurückgegeben. Wenn es nicht vorhanden ist, wird „false“ zurückgegeben. Fahren Sie dann mit der folgenden Logik fort.

Verwenden Sie den ??-Algorithmus, um den Code prägnanter zu gestalten

lass Benutzer = {
  Name : {
    Vorname: „Aofukaosi“
  }
}

lass foo = () => {
  Benutzername?.Vorname zurückgeben ?? 
  „Vorname existiert nicht“
}
  
Konsole.log(foo())

4. Return-Beendigungsfunktion

Die folgende Funktion ermittelt den Wert von x unter Verwendung vieler if else Verschachtelungen

sei x = 1;
lass foo = () => {
  wenn(x < 1){
    gibt zurück: „x ist kleiner als 1“
  } anders {
    wenn(x > 1){
      gibt zurück: „x ist größer als 1“
    }anders{
      returniere 'x ist gleich 1'
    }
  }
}

Konsole.log(foo())

Diese if else -Verschachtelung kann den Code durch Entfernen der else -Bedingung vereinfachen, da die „ return “-Anweisung die Codeausführung beendet und zur Funktion zurückkehrt.

sei x = 1;
lass foo = () => {
  wenn(x < 1){
    gibt zurück: „x ist kleiner als 1“
  }
  wenn(x > 1){
    gibt zurück 'x ist größer als'
  }
  returniere 'x ist gleich 1'
}

Konsole.log(foo())

Damit ist dieser Artikel über 4 superpraktische JS-Tipps zur Verbesserung der Entwicklungseffizienz abgeschlossen. Weitere verwandte 4 praktische JS-Tipps zur Verbesserung der Entwicklungseffizienz finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder durchsuchen Sie die verwandten Artikel unten weiter. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!