📚
Lerndokumentationen
Web
Web
  • Willkommen
  • HTML
    • Was ist HTML?
    • Elemente
    • Attribute
    • Boilerplate
  • Textelemente
  • Links
  • Dokumentenstruktur
  • Medien
  • Tabellen
  • Formulare
  • CSS
    • Was ist CSS?
    • Syntax
  • Einheiten
  • Selektoren
  • Boxmodell
  • Hintergründe und Rahmen
  • Overflow
  • Bilder
  • Formulare
  • Textelemente
  • Layout
    • Flexbox
    • Grid
  • Responsive Design
  • JavaScript
    • Was ist JavaScript?
    • Einbindung in HTML
    • Grundlagen
      • Variablen und Werte
      • Datentypen
      • Operatoren und Ausdrücke
      • Kontrollstrukturen
      • Schleifen
    • Funktionen
      • Funktionsdeklarationen vs. Funktionsausdrücke
      • Arrow Functions
      • Standardparameter und Rest-Parameter
      • First-Class und Higher-Order-Funktionen
      • Closures
      • IIFE (Immediately Invoked Function Expressions)
    • Arrays
      • Erstellen und Modifizieren
      • Iteration über Arrays
      • Sortieren
      • Nützliche Methoden
    • Objekte und Datenstrukturen
      • Erstellen und Manipulieren
      • Destructuring
      • Sets und Maps
    • Strings
      • Template Literals
      • Methoden
    • Moderne JavaScript-Features
      • Optionale Verkettung
      • Nullish Coalescing Operator
      • Spread und Rest Operator
      • Kurzschlussausdrücke
    • Scope und Kontext
      • this Keyword
      • Call, Apply und Bind
      • Hoisting und Temporal Dead Zone (TDZ)
    • Objektorientierte Programmierung
      • Prototypes
      • Constructor Functions
      • ES6 Classes
      • Die create()-Methode
    • Asynchronous JavaScript
      • AJAX
      • Promises
    • Zahlen, Daten, Internationalisierung und Timer
      • Mathematische Operationen
      • Datum und Zeit
      • Internationalisierung
      • Timer
    • Modules
    • JavaScript im Browser (DOM und Events)
      • Das DOM
      • Elemente auswählen, erstellen und manipulieren
      • Styles, Attribute und Klassen
      • Events und Event Listener
      • Event Propagation
        • Event Delegation
      • DOM Traversing
    • JavaScript Engine und Performance
      • Execution Context und Call Stack
  • TypeScript
    • Was ist TypeScript?
  • Compiler und Runtimes
  • Konfiguration
  • Types
    • Primitive Typen und Typableitung
    • Arrays und Tupel
    • Objekte
    • Top- und Bottom-Types
    • Enums
    • Utility Types
      • Records
  • Typenkombination
    • Union Types
    • Discriminated Unions
    • Intersections
  • Funktionen
  • Klassen
    • Grundlagen
    • Feldinitialisierer
    • Schreibgeschützte Felder
    • Implementieren
    • Private und Geschützte Member
    • Getter und Setter
    • Statische Member
    • Abstrakte Klassen und Member
  • Modules
    • Importieren und Exportieren
    • Ambient Types
    • Namespaces
    • Globals
  • React
    • Was ist React?
    • JSX
    • Komponenten
      • Root-Komponente
      • Styling
      • Listen
      • Conditional Rendering
      • Fragments
    • Props
      • Destructuring
      • Children
    • Interaktivität
      • Event Handling
      • State
      • Formulare
    • State Management
      • State anheben
      • Derived State
    • Komposition und Reusability
      • Komponentenstrukturierung
      • Prop Drilling
      • Komposition
Bereitgestellt von GitBook
Auf dieser Seite
  • any
  • unknown
  • never
  1. Types

Top- und Bottom-Types

any

Was ist, wenn du nicht weisst, welchen Typ eine Variable haben wird? Oder wenn du jeden Typ zulassen willst? TypeScript hat einen Typ für solche Fälle: any.

let age: any = 42;
age = "fortytwo";

Ich kann auch eine Funktion deklarieren, die einen beliebigen Typ annimmt:

const log = (value: any) => {
  console.log(value);
};

log(42);
log("Hello, TypeScript!");

JavaScript's fetch gibt standardmässig ein Promise vom Typ any zurück:

const getUserById = async (id: number) => {
  const resp = await fetch("http://example.com/user/1");
  return resp.json();
};

let  = getUserById(1);

Wenn du keinen Typ angibst, wird TypeScript den Typ any ableiten:

const add = (, ) => {
  return ;
};

any ist der flexibelste Typ in TypeScript. Er deaktiviert die Typüberprüfung für diese Variable. Dies ist nützlich, wenn du ein JavaScript-Projekt nach TypeScript migrierst und noch nicht mit allen Typfehlern umgehen kannst. Es ist auch in den seltenen Fällen nützlich, in denen du wirklich alles akzeptieren willst. Aber vermeide es so weit wie möglich, any zu verwenden. Der Sinn von TypeScript ist es, Typfehler abzufangen, und any macht das unmöglich!

unknown

unknown ist eine sicherere Alternative zu any. Bei unknown musst du eine Typüberprüfung durchführen, bevor du etwas damit tun kannst. unknown ist also nützlich für Werte, die zur Laufzeit akzeptiert werden, wenn wir den erwarteten Typ nicht kennen.

const getUserAge = async (id: number): Promise<unknown> => {
  const resp = await fetch("http://example.com/user/" + id);
  return resp.json();
};

const isOldEnoughToVote = (age: number): boolean => {
  return age >= 18;
};

const process = async () => {
  const age = await getUserAge(1);

  if (typeof age === "number") {
    console.log(isOldEnoughToVote(age));
  }
};

never

Wenn du etwas darstellen willst, das niemals passieren soll, kannst du never verwenden. never ist nützlich für erschöpfende Conditionals und erschöpfende Switch-Anweisungen.

function example(x: string | number) {
  if (typeof x === "string") {
    x.toUpperCase();
  } else if (typeof x === "number") {
    x.toFixed(2);
  } else {
    const _exhaustiveCheck: never = x; // type 'never' applies if we forget to handle a value in the union
    return _exhaustiveCheck;
  }
}
VorherigeObjekteNächsteEnums

Zuletzt aktualisiert vor 20 Tagen