Lassen Sie uns ausführlich über den Unterschied zwischen unbekannt und beliebig in TypeScript sprechen

Lassen Sie uns ausführlich über den Unterschied zwischen unbekannt und beliebig in TypeScript sprechen

Vorwort

Wir wissen, dass einer Variablen vom Typ „any“ jeder beliebige Wert zugewiesen werden kann.

lass meineVar: any = 0;
meineVar = "1";
meineVar = falsch;

Die TypeScript-Richtlinien raten von der Verwendung von „any“ ab, da dadurch Typbeschränkungen verloren gehen – und die Notwendigkeit von Typbeschränkungen ist einer der Gründe, warum wir uns für TypeScript entschieden haben, es ist also ein wenig widersprüchlich.

TypeScript (Version 3.0 und höher) bietet auch einen speziellen Typ namens „unknown“, der „any“ ähnelt. Wir können einer Variablen vom Typ „unbekannt“ auch einen beliebigen Wert zuweisen:

lass myVar: unbekannt = 0;
meineVar = "1";
meineVar = falsch;

Nun stellt sich die Frage: Was ist der Unterschied zwischen „any“ und „unknown“?

1. unbekannt vs. beliebig

Um den Unterschied zwischen „unbekannt“ und „beliebig“ besser zu verstehen, schreiben wir zunächst eine Funktion, die wir mit ihrem einzigen Argument aufrufen möchten.

Wir setzen den einzigen Parameter von invokeAnything() auf den Typ „any“.

Funktion invokeAnything(Rückruf: beliebig) {
  Rückruf();
}

invokeAnything(1); // wirft „TypeError: Rückruf ist keine Funktion“

Da der Callback-Parameter von beliebigem Typ sein kann, löst die Anweisung callback() keinen TypeError aus. Mit einer Variablen vom Typ „any“ können wir alles machen.

Beim Ausführen tritt jedoch ein Laufzeitfehler auf: TypeError: Rückruf ist keine Funktion. 1 ist eine Zahl und kann nicht als Funktion aufgerufen werden. TypeScript schützt den Code nicht vor diesem Fehler.

Wie können wir also zulassen, dass die Funktion invokeAnything() jeden Parametertyp akzeptiert und gleichzeitig eine Typprüfung des Parameters erzwingen, um den obigen Fehler zu vermeiden?

Bitten Sie den unbekannten Bruder, die Situation unter Kontrolle zu bringen.

Wie jede andere Variable akzeptiert auch die unbekannte Variable beliebige Werte. Aber TypeScript erzwingt eine Typprüfung, wenn Sie versuchen, eine unbekannte Variable zu verwenden. Ist es nicht das, was wir wollen?

Funktion invokeAnything(Rückruf: unbekannt) {
  Rückruf();
  // Objekt ist vom Typ „unbekannt“
}

rufe alles auf (1);

Da der Callback-Parameter vom Typ „unbekannt“ ist, weist die Anweisung callback() einen Typfehler auf: „Objekt ist vom Typ ‚unbekannt‘.“ Im Gegensatz zu allen anderen schützt uns TypeScript davor, etwas aufzurufen, das möglicherweise keine Funktion ist.

Bevor Sie eine Variable unbekannten Typs verwenden, müssen Sie eine Typprüfung durchführen. In diesem Fall müssen wir nur prüfen, ob der Rückruf ein Funktionstyp ist.

Funktion invokeAnything(Rückruf: unbekannt) {
  wenn (Typ des Rückrufs === 'Funktion') {
    Rückruf();
  }
}

rufe alles auf (1);

2. Das mentale Modell des Unbekannten und

Ehrlich gesagt hatte ich während meines Studiums große Schwierigkeiten, Unbekanntes zu verstehen. Wie unterscheidet es sich von any, da beide Typen beliebige Werte akzeptieren? Hier sind die Regeln, die mir geholfen haben, den Unterschied zwischen den beiden zu verstehen:

  • Sie können einem unbekannten Typ alles zuweisen, Sie können jedoch keine Operationen mit dem Unbekannten durchführen, bevor Sie eine Typprüfung oder Typbehauptung durchgeführt haben.
  • Sie können jedem Typ alles zuweisen und mit jedem Typ jede beliebige Operation ausführen.

Das obige Beispiel veranschaulicht die Ähnlichkeiten und Unterschiede zwischen „unbekannt“ und „beliebig“.

unbekannt Beispiel:

Funktion invokeAnything(Rückruf: unbekannt) {
  // Sie können dem Typ „unbekannt“ alles zuweisen,
  // Sie können jedoch nicht mit `unbekannt` arbeiten, bevor Sie eine Typprüfung oder Typbehauptung durchführen, wenn (typeof callback === 'function') {
    Rückruf();
  }
}

invokeAnything(1); // Sie können dem Typ „unbekannt“ alles zuweisen.

Die Typprüfung typeof callback === 'function' prüft, ob callback eine Funktion ist. Wenn ja, kann sie aufgerufen werden.

jedes Beispiel:

Funktion invokeAnything(Rückruf: beliebig) {
  // Sie können jede Operation für „jeden“ Typ ausführen callback();
}

invokeAnything(1); // Sie können dem Typ „any“ alles zuweisen.

Wenn ein beliebiger Rückruf erfolgt, erzwingt TypeScript keine Typprüfung der callback()-Anweisung.

3. Zusammenfassung

„Unknown“ und „any“ sind zwei spezielle Typen, die beliebige Werte enthalten können.

Es wird empfohlen, „unknown“ statt „any“ zu verwenden, da dies eine höhere Typsicherheit bietet. Wenn Sie mit „unknown“ arbeiten möchten, müssen Sie eine Typzusicherung verwenden oder es auf einen bestimmten Typ eingrenzen.

~~ Ende. Ich bin Xiaozhi. Meine Freundin arbeitet in der Bildungs- und Ausbildungsbranche. Ihr Gehalt ist in letzter Zeit etwas niedrig, deshalb habe ich vor, mehr zu arbeiten und mehr Geld zu verdienen.

Es gibt keine Möglichkeit, in Echtzeit zu wissen, welche Fehler beim Bearbeiten vorhanden sein könnten. Um diese Fehler anschließend zu beheben, wurde viel Zeit mit dem Debuggen von Protokollen verbracht. Übrigens möchte ich ein nützliches Fehlerüberwachungstool namens Fundebug empfehlen.

Originaltext: dmitripvlutin.com/typescript-…

Zusammenfassen

Dies ist das Ende dieses Artikels über den Unterschied zwischen „unbekannt“ und „beliebig“ in TypeScript. Weitere Informationen zum Unterschied zwischen „unbekannt“ und „beliebig“ in TypeScript finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!

<<:  Der Button ist im IE auf beiden Seiten gestreckt

>>:  CSS-Implementierungscode zum Zeichnen von Dreiecken (Rahmenmethode)

Artikel empfehlen

So implementieren Sie Leerzeichen in Taobao mit CSS3

Machen Sie einen leeren Bereich für Taobao: Wenn ...

So erstellen Sie ein React-Projekt mit Vite

Inhaltsverzeichnis Vorwort Erstellen Sie ein Vite...

Webdesign-TabIndex-Element

TabIndex dient zum Drücken der Tabulatortaste, um ...

So zeigen Sie Dateien im Docker-Image an

So zeigen Sie Dateien in einem Docker-Image an 1....

Implementierung der kollaborativen Nutzung von React-Komponenten

Inhaltsverzeichnis Verschachtelung Kommunikation ...

Erweiterte Closures in JavaScript erklärt

Inhaltsverzeichnis 1. Das Konzept der Schließung ...

Einführung in die Parameter und Regeln für reguläre Ausdrücke bei Nginx

Vorwort In letzter Zeit habe ich Kunden dabei geh...

Eine kurze Analyse der asynchronen DOM-Aktualisierung von Vue

Inhaltsverzeichnis Das Prinzip der asynchronen DO...