Lassen Sie uns über die Verwendungsfähigkeiten der bedingten Beurteilung von JavaScript sprechen

Dieser Artikel vermittelt Ihnen relevantes Wissen über JavaScript. Es geht hauptsächlich um die Verwendungsfähigkeiten der bedingten Beurteilung von JavaScript. Ich hoffe, dass er für alle hilfreich ist.

In diesem Artikel erfahren Sie, wie Sie einfachere bedingte Urteile in JavaScript schreiben, um prägnanteren Code zu schreiben. Quellcode-Adresse

Angenommen, wir haben eine Funktion, die Farbwerte in hexadezimale Kodierung umwandelt.

function convertToHex(color) {
  if (typeof color === 'string') {
    if (color === 'slate') {
      return '#64748b'
    } else if (color === 'gray') {
      return '#6b7280'
    } else if (color === 'red') {
      return '#ef4444'
    } else if (color === 'orange') {
      return '#f97316'
    } else if (color === 'yellow') {
      return '#eab308'
    } else if (color === 'green') {
      return '#22c55e'
    } else {
      return '#ffffff'
    }
  } else {
    return '#ffffff'
  }
}

Die Funktion dieser Funktion ist sehr einfach: Sie übergibt die Farbzeichenfolge und gibt dann die entsprechende Hexadezimalzahl zurück. Wenn die übergebene Zeichenfolge keine Zeichenfolge ist oder nichts übergeben wird, wird die weiße Hexadezimalzahl zurückgegeben.

Als nächstes beginnen wir mit der Optimierung dieses Codes.

Vermeiden Sie die direkte Verwendung von Zeichenfolgen als Bedingungen

Es gibt ein Problem bei der direkten Verwendung von Zeichenfolgen als Bedingungen, das heißt, es wird peinlich, wenn wir Rechtschreibfehler machen.

convertToHex("salte")

Um diesen Fehler zu vermeiden, können wir Konstanten verwenden.

const Colors = {
	SLATE: 'slate',
  GRAY: 'gray',
  // ...
}
function convertToHex(color) {
  if (typeof color === 'string') {
    if (color === Colors.SLATE) {
      return '#64748b'
    } else if (color === Color.GRAY) {
      return '#6b7280'
    }
    // ...
  } else {
    return '#ffffff'
  }
}
convertToHex(Colors.SLATE)

Wenn Sie Typoskript verwenden, können Sie Aufzählungen direkt verwenden.

Objekt verwenden

Tatsächlich ist es nicht schwer, anhand des obigen Codes herauszufinden, dass wir den Hexadezimalwert direkt im Wert des Objekts speichern können.

const Colors = {
	SLATE: '#64748b',
  GRAY: '#6b7280',
  // ...
}
function convertToHex(color) {
  if (color in Colors) {
    return Colors[color]
  } else {
    return '#ffffff'
  }
}
convertToHex(Colors.SLATE)

Auf diese Weise wird der Code prägnanter und einfacher zu lesen.

Wenn die Erwartungen nicht erfüllt werden, kehren Sie im Voraus zurück.

Eine weitere bewährte Methode besteht darin, dass wir die Situation, die nicht den Erwartungen entspricht, an den Anfang der Veranstaltung schreiben und im Voraus zurückkehren können, um zu vermeiden, dass wir die Rückkehr vergessen. const Farben = { SLATE: '#64748b', GRAU: '#6b7280', // ... } Funktion convertToHex(color) { if (!color in Farben) { gib '#ffffff' zurück } return Farben[Farbe] } ConvertToHex(Colors.SLATE)

const Colors = {
	SLATE: '#64748b',
  GRAY: '#6b7280',
  // ...
}
function convertToHex(color) {
  if (!color in Colors) {
    return '#ffffff'
  }
  return Colors[color]
}
convertToHex(Colors.SLATE)

Auf diese Weise besteht keine Notwendigkeit für etwas anderes. Mit dieser Technik können wir viele andere Dinge in unserem Code eliminieren.

Map mit Objekt verwenden

Die Verwendung von Map ist professioneller, da Map jede Art von Schlüssel speichern kann, von Map.prototype erbt und über praktischere Methoden und Eigenschaften verfügt.

Und Object ist bequemer für den Zugriff auf Eigenschaften. Wir können Object weiterhin zum Implementieren der Aufzählung verwenden.

const ColorsEnum = {
	SLATE: 'slate',
  GRAY: 'gray',
  // ...
}
const Colors = new Map()
Colors.set(ColorsEnum.SLATE, '#64748b')
Colors.set(ColorsEnum.GRAY, '#6b7280')
// ...
Colors.set('DEFAULT', '#ffffff')
function convertToHex(color) {
  if (!Colors.has(color)) {
    return Colors.get('DEFAULT')
  }
  return Colors.get(color)
}
convertToHex(Colors.SLATE)

Map kann auch Funktionen speichern

Angenommen, wir speichern viele Farben, bis zu Tausenden von Farben, und müssen auch die Back-End-Konfiguration unterstützen, und die Ergebnisse können durch einen Berechnungsprozess erhalten werden.

Dann können wir Map zum Speichern von Funktionen verwenden.

return Colors.get(color)()

Versuchen Sie, ternäre Ausdrücke und Schalter zu vermeiden.

Obwohl ternäre Ausdrücke kurz sind, ist ihre Lesbarkeit stark eingeschränkt. Wenn es sich um eine mehrstufige Bedingung handelt, ist sie sehr schwer zu lesen.

switch hat keine offensichtlichen Vorteile gegenüber if. Stattdessen ist es manchmal einfach, zurückzukehren, was dazu führt, dass der Code nicht wie erwartet ausgeführt wird.

Das Obige ist eine detaillierte Erläuterung der Verwendungstechniken für die bedingte Beurteilung von JavaScript.

Empfohlenes Lernen: „JavaScript-Video-Tutorial“

Das obige ist der detaillierte Inhalt vonLassen Sie uns über die Verwendungsfähigkeiten der bedingten Beurteilung von JavaScript sprechen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!