Schauen wir uns einige leistungsstarke Operatoren in JavaScript an

Schauen wir uns einige leistungsstarke Operatoren in JavaScript an

Vorwort

Sind Sie beim Lesen des Codes anderer Leute schon einmal auf seltsame Schreibmethoden gestoßen, die Ihren Gedankengang sofort ins Stocken brachten? Als Sie zur Besinnung kommen, erkennen Sie plötzlich, dass ein bestimmter Held schon einmal hier gewesen ist.

Lassen Sie uns heute einen Blick auf einige leistungsstarke Operatoren in JavaScript werfen~~~

1. Null-Koaleszenzoperator

Wenn Sie beim ersten Betrachten zwei Fragezeichen sehen, haben Sie wahrscheinlich noch mehr Fragezeichen im Kopf (Kinder, habt ihr viele Fragezeichen~~~)

Die beiden Fragezeichen werden als Null-Koaleszenzoperator bezeichnet. Wenn das erste Argument nicht null/undefiniert ist, wird das erste Argument zurückgegeben, andernfalls das zweite Argument.

console.log(1 ?? "www.shanzhzonglei.com"); // 1
console.log(false ?? "www.shanzhzonglei.com"); // falsch
console.log(null ?? "www.shanzhzonglei.com"); // www.shanzhzonglei.com
console.log(undefiniert ?? "www.shanzhzonglei.com"); // // www.shanzhzonglei.com

Daher wird der zweite Parameter nur zurückgegeben, wenn der erste Parameter null/undefiniert ist.

Beachten Sie, dass, obwohl „undefiniert“, „Nullobjekt“, „Wert 0“, „NaN“, „Boolescher Wert falsch“ und „leere Zeichenfolge '' in JS alle falsche Werte sind, der Nicht-Null-Operator ?? nur null/undefiniert verarbeitet.

Er unterscheidet sich vom logischen ODER-Operator (||), der den rechten Operanden zurückgibt, wenn der linke Operand falsch ist. Zum Beispiel, wenn es sich um einen falschen Wert handelt ('' oder 0).

konsole.log(1 || 2); // 1
console.log("" || 2); // 2

2. ??= leerer Zuweisungsoperator

Oh, jetzt gibt es mehr als zwei Fragezeichen, es gibt auch ein Gleichheitszeichen. Werden die Fragen schwieriger?

??= Leerer Zuweisungsoperator. Dieser Zuweisungsoperator weist nur dann einen Wert zu, wenn der Wert null oder undefiniert ist.

const student = { Alter: 20 };
Schüler.Alter??= 18;
console.log(Schüleralter); // 20

Schülername ??= "shanguagua";
console.log(Studentenname); // 'shanguagua'

Es ist mit dem ?? Null-Koaleszenzoperator oben verwandt: x ??= y ist gleichbedeutend mit x ?? (x = y), und x = y wird nur ausgeführt, wenn x null oder undefiniert ist.

sei x = null;
x ??= 20;
console.log(x); // 20

sei y = 5;
y ??= 10;
console.log(y); // 5

3. ?. Optionaler Verkettungsoperator

Der optionale Verkettungsoperator ?. ermöglicht das Lesen des Werts einer Eigenschaft, die tief in einer Kette verbundener Objekte liegt, ohne explizit überprüfen zu müssen, ob jede Referenz in der Kette gültig ist. Der Operator prüft implizit, ob die Eigenschaft des Objekts null oder undefiniert ist, wodurch der Code eleganter und prägnanter wird.

const obj = {
  Name: "Kleinanzeigen",
  foo: {
    Bar: {
      baz: 18,
      Spaß: () => {},
    },
  },
  Schule:
    Studierende:
      {
        Name: "shanguagua",
      },
    ],
  },
  sagen() {
    gebe „www.shanzhonglei.com“ zurück;
  },
};

konsole.log(obj?.foo?.bar?.baz); // 18
console.log(obj?.school?.students?.[0]["name"]); // shanguagua
console.log(obj?.say?.()); // www.shanzhonglei.com

4. ?: Ternärer Operator

Er wird auch ternärer Operator genannt. Nun, das wird sehr häufig verwendet.

Berechnen Sie für den bedingten Ausdruck b? x: y zuerst die Bedingung b und treffen Sie dann eine Beurteilung. Wenn der Wert von b wahr ist, berechnen Sie den Wert von x und das Ergebnis ist der Wert von x; andernfalls berechnen Sie den Wert von y und das Ergebnis ist der Wert von y.

konsole.log(falsch ? 1 : 2); // 2
konsole.log(true ? 1 : 2); // 1

5. Logisches UND (&&) und Logisches ODER (||)

Lassen Sie uns zunächst Folgendes wiederholen:

Logisches UND (&&): Wenn der erste Operand wahr ist, wird der zweite Operand nicht ausgewertet, da das endgültige Berechnungsergebnis unabhängig vom zweiten Operand wahr sein muss.

In der tatsächlichen Entwicklung können durch die Verwendung dieser Funktion die folgenden Vorgänge erreicht werden:

1. Wenn ein Wert wahr ist, führen Sie eine Funktion aus

Funktion say() {
  console.log("www.shanzhonglei.com");
}
lass Typ = wahr;
Typ && say(); // www.shanzhonglei.com

2. Bestimmen Sie einen Wert

// Nur wenn das Alter größer als 10 und kleiner als 20 ist, wird es ausgeführt, wenn (Alter > 10 && Alter < 20) {
  console.log(Alter);
}

Logisches ODER (||): Wenn der erste Operand falsch ist (dh der falsche Wert von js), wird der zweite Operand nicht ausgewertet, da zu diesem Zeitpunkt das endgültige Berechnungsergebnis falsch sein muss, unabhängig davon, was der zweite Operand ist.

In der tatsächlichen Entwicklung können durch die Verwendung dieser Funktion die folgenden Vorgänge erreicht werden:

1. Legen Sie einen Anfangswert für eine Variable fest

lass Schüler = {
  Name: "shanguagua",
};

console.log(Studentenalter || "www.shanzhonglei.com"); // www.shanzhonglei.com

2. Bestimmen Sie einen Wert

// Wenn das Alter gleich 10 oder gleich 20 oder gleich 30 ist, führe aus, wenn (Alter === 10 || Alter === 20 || Alter === 30) {
  console.log(Alter);
}

6. Bitweise Operatoren & und |

Bitweise Operatoren arbeiten mit Bits, wie & (und) und | (oder). Bei der Verwendung bitweiser Operatoren werden Dezimalstellen verworfen. Wir können |0 verwenden, um die Zahl zu runden. Sie können &1 auch verwenden, um gerade oder ungerade Zahlen zu bestimmen.

In der tatsächlichen Entwicklung können durch die Verwendung dieser Funktion die folgenden Vorgänge erreicht werden:

1. Rundung

1.3 |
  (0 - // 1 ausdrucken
    1,9) |
  0; // -1 ausgeben

2. Bestimmen Sie ungerade und gerade Zahlen

sei num = 5;
!!(Zahl & 1); // wahr
!!(Anzahl % 2); // wahr

7. Doppelbitoperator~~

Sie können den bitweisen Operator anstelle von Math.floor() für positive Zahlen und Math.ceil() für negative Zahlen verwenden.

Der Vorteil des bitweisen Operators mit doppelter Negation besteht darin, dass er dieselbe Operation schneller ausführt; für positive Zahlen liefert ~~ dasselbe Ergebnis wie Math.floor() und für negative Zahlen dasselbe Ergebnis wie Math.ceil().

Math.floor(5.2) === 5; // wahr
~~3.2 === 3; // wahr
Math.ceil(-6.6) === -6; // wahr
~~-4,5 === -6; // wahr

7. Logische Operatoren!

!, kann die Variable in den Booleschen Typ konvertieren, Null, undefiniert und leere Zeichenfolge „“ werden alle zu „true“ negiert und der Rest ist „false“. Generell gibt es mehrere Verwendungen: !, !!, !=, !==.

7.1 Verwenden von ! zum Negieren

lass cat = false;
console.log(!cat); // wahr

7.2 Verwenden von !! zur Typbeurteilung

Diese Methode kann nur ausgeführt werden, wenn die Variable a ungleich null, undefiniert oder „“ ist.

var a;
wenn (a != null && Typ von a != undefiniert && a != "") {
  //Code der nur ausgeführt wird, wenn a Inhalt hat}

ist gleichbedeutend mit:

wenn (!!a) {
  //aCode, der nur ausgeführt wird, wenn Inhalt vorhanden ist...
}

7.3 Sind zwei Werte gleich?

Im Allgemeinen sind alle ungleich !==, denn wenn Sie ungleich != verwenden, gibt 0 != "" false zurück. Der Grund dafür ist, dass in JS sowohl 0 als auch '' falsch sind, wenn sie in den Booleschen Typ konvertiert werden. Daher wird empfohlen, alle ungleich !== zu verwenden.

sei a = 0;
sei b = 0;
sei c = "0";
sei d = '';
a != b //falsch
a != c // falsch Zahl und String 0 werden als gleich betrachteta != d // falsch 0 und leerer String werden als gleich betrachteta !== b // falsch
a !== c // wahr
a !== d // wahr

Zusammenfassen

Damit ist dieser Artikel über einige leistungsstarke Operatoren in JavaScript abgeschlossen. Weitere Informationen zu leistungsstarken JavaScript-Operatoren 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:
  • js und oder Operator || && magische Verwendung
  • Detaillierte Erklärung der Operatoren || und && in js
  • Anwendungsbeispiele für ternäre Operatoren in JavaScript
  • Verwendung von Javascript typeof und Einführung des typeof-Operators [detailliert]
  • Javascript-Operator für bitweise Negation (~)
  • Verständnis und Analyse des bitweisen Nicht-(~)-Operators und des ~~-Operators von JS
  • Analyse und Beispiele des Unterschieds zwischen ternären Operatoren und if else in JS
  • Detaillierte Erklärung der Verwendung und Funktion des JS-Operators einzelner vertikaler Strich „|“ und „||“
  • Lernen Sie die Operatoren der Potenzierung, Quadratwurzel und Variablenformatkonvertierung in JS kennen
  • Einführung in den bitweisen Linksverschiebungsoperator (<<) in Javascript

<<:  Detaillierte Erklärung der Gründe, warum MySQL-Verbindungen hängen bleiben

>>:  Lösung für das Problem der automatischen Wiederherstellung nach der Änderung von server.xml und content.xml in Tomcat

Artikel empfehlen

Auswahl und Überlegungen zur MySQL-Datensicherungsmethode

Inhaltsverzeichnis 1. rsync, cp Dateien kopieren ...

Ausführliche Erklärung verschiedener binärer Objektbeziehungen in JavaScript

Inhaltsverzeichnis Vorwort Beziehungen zwischen v...

Zusammenfassung der Situationen, in denen MySQL-Indizes nicht verwendet werden

Indextypen in MySQL Im Allgemeinen können sie in ...

So implementieren Sie Eingabe-Checkboxen zur Erweiterung der Klickreichweite

XML/HTML-CodeInhalt in die Zwischenablage kopiere...

So verwenden Sie HTML+CSS zum Erstellen einer TG-Vision-Homepage

Dieses Mal verwenden wir HTML+CSS-Layout, um eine...

js, um einen Ein- und Ausblendeffekt des Bildes zu erzielen

In diesem Artikel wird der spezifische Code von j...

MySQL 8.0.19 Installations-Tutorial

Laden Sie das Installationspaket von der offiziel...

js implementiert Array-Abflachung

Inhaltsverzeichnis So reduzieren Sie ein Array 1....

So verwenden Sie Nginx zum Simulieren der Canary-Freigabe

Dieser Artikel stellt die Blue-Green-Bereitstellu...

Natives, benutzerdefiniertes Rechtsklickmenü von js

In diesem Artikelbeispiel wird der spezifische Co...