Ein Beispiel für das elegante Schreiben von Urteilen in JavaScript

Ein Beispiel für das elegante Schreiben von Urteilen in JavaScript

Vorwort

Wenn wir JavaScript schreiben, stoßen wir häufig auf logische Urteile, die mit if/else oder switch umgesetzt werden können. Bei komplexen Urteilen machen jedoch zu viele Bedingungen unseren Code oft lang und verringern die Lesbarkeit. Also müssen wir unseren Code optimieren, um ihn eleganter zu machen💎.

1. Monadisches Urteil

1.1 Beispiel

Wir schreiben eine allgemeine if/else-Beurteilungsfunktion und optimieren sie dann.

const meineFunktion = (status) => {
  wenn (Status === 1) {
    console.log("status1");
  } sonst wenn (Status === 2) {
    console.log("status2");
  } sonst wenn (Status === 3) {
    console.log("status3");
  }
};

1.2 Setzen Sie es in das Objekt ein

Wir wissen, dass das Objekt von JavaScript eigentlich eine ungeordnete Sammlung von Schlüssel-Wert-Paaren ist, weshalb wir es zum Speichern von Beurteilungsbedingungen verwenden können. Beispielsweise ist im obigen Fall die Beurteilungsbedingung ein numerischer Typ und die nachfolgende Operation verwendet nur eine Zeichenfolge. Zu diesem Zeitpunkt können wir ein Objekt erstellen und die verwendete Zahl und Zeichenfolge als Schlüsselnamen bzw. entsprechenden Wert des Objekts verwenden.

//Setze die Beurteilungsbedingung in das Objekt ein const statusObj = {
  1: "status1",
  2: "status2",
  3: "status3",
};

// Optimierte Funktion 💎
const meineFunktion = (status) => {
  console.log(statusObj[status]);
};

1.3 In Karte einfügen

Zusätzlich zu primitiven Objekten können wir auch Map-Objekte verwenden. Sehen wir uns die Beschreibung von MDN dazu an:

Map-Objekte speichern Schlüssel-Wert-Paare und können sich die ursprüngliche Einfügereihenfolge der Schlüssel merken. Jeder beliebige Wert (Objekt oder Primitiv) kann als Schlüssel oder Wert verwendet werden.

Es ist nicht schwer zu erkennen, dass das Map-Objekt tatsächlich eine erweiterte Version des normalen Objekts ist. Insbesondere kann jeder Wert als Schlüssel-Wert-Paar verwendet werden, was bedeutet, dass Funktionen, reguläre Ausdrücke usw. auch als Schlüssel oder Wert verwendet werden können, was unsere Operationen, bei denen wir es als Beurteilung verwenden, erheblich erleichtert. Auf die Details zum Map-Objekt wird hier nicht näher eingegangen.

//Setze die Beurteilungsbedingungen in die Map ein const statusMap = new Map([
  [1, "status1"],
  [2, "status2"],
  [3, "status3"],
]);

// Optimierte Funktion 💎
const meineFunktion = (status) => {
  console.log(statusMap.get(status));
};

2. Mehrfachbeurteilung

2.1 Ein Beispiel

Da univariate Urteile optimiert werden können, können auch plurale Urteile optimiert werden. Im Folgenden wird ein Fall mit zwei Urteilsbedingungen beschrieben.

// Gib ein Beispiel 🌰
const meineFunktion = (rechts, status) => {
  if (rechts === "Administrator" && Status === 1) {
    console.log("Administrator mag Wang Bingbing");
  } sonst wenn (rechts === "Administrator" && Status === 2) {
    console.log("Administrator mag Wang Bingbing nicht");
  } sonst wenn (rechts === "Benutzer" && Status === 1) {
    console.log("Benutzer mag Wang Bingbing");
  } sonst wenn (rechts === "Benutzer" && Status === 2) {
    console.log("Der Benutzer mag Wang Bingbing nicht");
  }
};

// Beispiel mit Duplizierung 🌰
const meineFunktion = (rechts, status) => {
  if (rechts === "Administrator" && Status === 1) {
    console.log("Administrator mag Wang Bingbing");
  } sonst wenn (rechts === "Administrator" && Status === 2) {
    console.log("Administrator mag Wang Bingbing");
  } sonst wenn (rechts === "Benutzer" && Status === 1) {
    console.log("Benutzer mag Wang Bingbing");
  } sonst wenn (rechts === "Benutzer" && Status === 2) {
    console.log("Benutzer mag Wang Bingbing");
  }
};

2.2 Setzen Sie die Beurteilungsbedingungen in eine Zeichenfolge und fügen Sie sie in das Objekt ein

Beide Situationen können auch durch die Verwendung von Object optimiert werden.

// „Beispiel 🌰“ optimieren

//Setze die Beurteilungsbedingung in das Objekt ein const actionsObj = {
  "administrator-1": "Administrator mag Wang Bingbing",
  "administrator-2": "Administrator mag Wang Bingbing nicht",
  "user-1": "Benutzer mag Wang Bingbing",
  "user-2": "Der Benutzer mag Wang Bingbing nicht",
};

// Optimierte Funktion 💎
const meineFunktion = (rechts, status) => {
  Konsole.log(actionsObj[`${right}-${status}`]);
};

// Sie können die Funktion als „Wert“ verwenden. Die folgenden Fälle sind ähnlich und werden nicht im Detail beschrieben.
const AktionenObj = {
  "administrator-1": () => console.log("Administrator mag Wang Bingbing"),
  "administrator-2": () => console.log("Administrator mag Wang Bingbing"),
  "user-1": () => console.log("Administrator mag Wang Bingbing"),
  "user-2": () => console.log("Administrator mag Wang Bingbing"),
};

// Optimierte Funktion 💎
const meineFunktion = (rechts, status) => {
  AktionenObj[`${right}-${status}`]();
};

// „Beispiele mit doppelten Situationen 🌰“ optimieren
// Öffentliche Funktionen können extrahiert werden. Die folgenden Situationen sind ähnlich und werden nicht wiederholt 🍓
const Aktionen = () => {
  const f1 = () => console.log("Administrator mag Wang Bingbing");
  const f2 = () => console.log("Benutzer mag Wang Bingbing");

  zurückkehren {
    "Administrator-1": f1,
    "Administrator-2": f1,
    "Benutzer-1": f2,
    "Benutzer-2": f2,
  };
};

// Optimierte Funktion 💎
const meineFunktion = (rechts, status) => {
  Aktionen()[`${right}-${status}`]();
};

2.3 Setzen Sie die Beurteilungsbedingungen in eine Zeichenfolge und fügen Sie sie in die Karte ein

In ähnlicher Weise können wir auch Map-Objekte verwenden. Wir speichern die beiden Bedingungen als Strings.

// „Beispiel 🌰“ optimieren

//Setze die Beurteilungsbedingungen in die Map ein const actionsMap = new Map([
    ['administrator-1', 'Administrator mag Wang Bingbing'],
    ['administrator-2', 'Der Administrator mag Wang Bingbing nicht'],
    ['user-1', 'Benutzer mag Wang Bingbing'],
    ['Benutzer-2', 'Der Benutzer mag Wang Bingbing nicht']
]);

// Optimierte Funktion 💎
const meineFunktion = (rechts, status) => {
    console.log(actionsMap.get(`${right}-${status}`));
};

2.4 Setzen Sie die Beurteilungsbedingung in das Objekt und dann in die Karte ein

// „Beispiel 🌰“ optimieren

//Setze die Beurteilungsbedingungen in die Map ein const actionsMap = new Map([
    [{ right: 'administrator', status: 1 }, () => console.log('Administrator mag Wang Bingbing')],
    [{ right: 'administrator', status: 2 }, () => console.log('Administrator mag Wang Bingbing nicht')],
    [{ right: 'user', status: 1 }, () => console.log('Benutzer mag Wang Bingbing')],
    [{ right: 'user', status: 2 }, () => console.log('Der Benutzer mag Wang Bingbing nicht')]
]);

// Optimierte Funktion 💎
const meineFunktion = (rechts, status) => {
    const action = [...actionsMap].filter(([e]) => (e.right === right && e.status === status));
    Aktion.fürJeden(([_, index]) => index.call());
};

2.5 Schreiben Sie die Beurteilungsbedingung als regulären Ausdruck und fügen Sie sie dann in die Karte ein

Mit regulären Ausdrücken können relativ komplexe Situationen behandelt werden.

// „Beispiele mit doppelten Situationen 🌰“ optimieren

// Schreibe die Beurteilungsbedingung als regulären Ausdruck und füge sie dann in die Map ein const actions = () => {
    const f1 = () => console.log('Dem Administrator gefällt Wang Bingbing');
    const f2 = () => console.log('Benutzer mag Wang Bingbing');

    gib eine neue Karte zurück ([
        [/^administrator-[1-2]/, f1],
        [/^Benutzer-[1-2]/, f2]
    ]);
};

// Optimierte Funktion 💎
const meineFunktion = (rechts, status) => {
    const action = [...actions()].filter(([e]) => e.test(`${right}-${status}`));
    Aktion.fürJeden(([_, index]) => index.call());
};

Abschluss

Wir verwenden native Objekt- und Map-Objekte, um die Beurteilung zu optimieren, aber im eigentlichen Entwicklungsprozess müssen wir dennoch zunächst dem Prinzip der Praktikabilität folgen und eine Überoptimierung vermeiden.

Dies ist das Ende dieses Artikels über die elegante Art, Urteile in JavaScript zu schreiben. Weitere Informationen zur eleganten Art, Urteile in JavaScript zu schreiben, finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!

Das könnte Sie auch interessieren:
  • Detaillierte Erklärung der Javascript-Grundlagenschleife
  • So verwenden Sie async und await richtig in JS-Schleifen
  • Vier Methoden zur Datentypbeurteilung in JS
  • Über den Unterschied zwischen js typeof und instanceof bei der Beurteilung von Datentypen und deren Entwicklung und Verwendung
  • So konvertieren Sie eine Zeichenfolge in JavaScript in eine Zahl
  • parseInt parseFloat js Zeichenfolge Konvertierung Nummer
  • Allgemeine JavaScript-Anweisungen: Schleife, Beurteilung, Zeichenfolge in Zahl

<<:  Tutorial zu HTML-Tabellen-Tags (8): Hintergrundbild-Attribut BACKGROUND

>>:  Nginx übernimmt die Analyse des Implementierungsprozesses für HTTP-Anforderungen

Artikel empfehlen

Referenzschreiben im JS- und CSS-Stil

CSS: 1. <link type="text/css" href=&q...

Detaillierte Erklärung des Sticky Position-Attributs in CSS

Beim Entwickeln mobiler Apps stoßen Sie häufig au...

Detaillierte Erläuterung des Prozesses der Verwendung von GPU in Docker

Inhaltsverzeichnis tf-gpu herunterladen Erstellen...

Detaillierte Erklärung der Grundkonzepte von HTML

Was ist HTML? HTML ist eine Sprache zur Beschreib...

So zeigen Sie den Typ des gemounteten Dateisystems in Linux an

Vorwort Wie Sie wissen, unterstützt Linux viele D...

Einführung in HTML_PowerNode Java Academy

Was ist HTML? HTML ist eine Sprache zur Beschreib...

Verwenden von Openlayer in Vue, um einen Ladeanimationseffekt zu realisieren

Hinweis: Sie können keine bereichsbezogenen Anima...

Vor- und Nachteile des Tabellenlayouts und warum es nicht empfohlen wird

Nachteile von Tabellen 1. Tabellen nehmen mehr Byt...

5 einfache XHTML-Webformulare für Webdesign

Einfaches XHTML-Webformular im Webdesign 5. Techn...