Datentypen in TypeScript

Articles

Dieser Artikel erklärt Datentypen in TypeScript.

YouTube Video

Datentypen in TypeScript

TypeScript bietet eine Vielzahl von Datentypen. Dadurch können Sie strikte Typen für Variablen, Funktionsargumente und Rückgabewerte definieren. Im Folgenden sind die Hauptdatentypen und deren Verwendung aufgeführt.

Primitive Datentypen

number-Typ

1let age: number = 25;
2console.log(age);          // Outputs: 25
3console.log(typeof age);    // Outputs: number

number ist ein Typ, der zur Verarbeitung numerischer Werte verwendet wird, einschließlich Ganzzahlen und Gleitkommazahlen (Dezimalzahlen). Das Verarbeiten von Werten, die bestimmte Grenzen überschreiten, führt zu Infinity oder NaN (Not-a-Number).

1// Decimal calculations
2console.log(0.1 + 0.2 === 0.3); // false
3console.log(0.1 + 0.2); // 0.30000000000000004
4
5// Calculations with large numbers
6console.log(9007199254740991 + 1); // correct value
7console.log(9007199254740991 + 2); // incorrect value

In TypeScript werden Zahlen als Gleitkommazahlen dargestellt. Dies kann zu geringfügigen Ungenauigkeiten in den Berechnungsergebnissen führen.
Wenn präzise Berechnungen erforderlich sind, wie beispielsweise bei finanziellen Beträgen, müssen Rundungsfehler wie diese vermieden werden. Sie können beispielsweise BigInt oder toFixed() verwenden oder die Dezimalstellen mit Bibliotheken wie decimal.js anpassen.

string-Typ

Der string-Typ verarbeitet textuelle Daten.

1let greeting: string = "Hello, TypeScript!";
2console.log(greeting);     // Outputs: Hello, TypeScript!
3console.log(typeof greeting);  // Outputs: string

boolean (logischer Typ)

Der boolean-Typ hat zwei Werte: true oder false.

1let isOpen: boolean = true;
2console.log(isOpen);       // Outputs: true
3console.log(typeof isOpen);    // Outputs: boolean

null und undefined

null steht für einen 'nicht vorhandenen Wert', und undefined steht für einen 'undefinierten Wert'.

1let emptyValue: null = null;
2let notDefined: undefined = undefined;
3
4console.log(emptyValue);       // Outputs: null
5console.log(typeof emptyValue);    // Outputs: object (JavaScript specification)
6
7console.log(notDefined);       // Outputs: undefined
8console.log(typeof notDefined);    // Outputs: undefined

Array

In TypeScript können Sie den Typ von Array-Elementen angeben. number[] ist ein Array von Zahlen, und string[] ist ein Array von Zeichenketten.

1let numbers: number[] = [1, 2, 3, 4];
2console.log(numbers);        // Outputs: [1, 2, 3, 4]
3console.log(typeof numbers); // Outputs: object
4
5let words: string[] = ["TypeScript", "JavaScript"];
6console.log(words);          // Outputs: ["TypeScript", "JavaScript"]
7console.log(typeof words);   // Outputs: object

Tuple

Ein Tuple ist ein Array mit Elementen unterschiedlichen Typs.

1let person: [string, number] = ["Alice", 30];
2console.log(person);         // Outputs: ["Alice", 30]
3console.log(typeof person);  // Outputs: object

Enum

enum definiert eine Menge benannter Konstanten.

1enum Color {
2    Red,
3    Green,
4    Blue
5}
6
7let favoriteColor: Color = Color.Green;
8console.log(favoriteColor);  // Outputs: 1 (Defaults start from 0)
9console.log(typeof favoriteColor); // Outputs: number

any

Der any-Typ kann beliebige Werte enthalten und wird verwendet, wenn Sie die Typprüfung deaktivieren möchten.

1let anything: any = "Hello";
2console.log(anything);       // Outputs: Hello
3console.log(typeof anything);    // Outputs: string
4
5anything = 42;
6console.log(anything);       // Outputs: 42
7console.log(typeof anything);    // Outputs: number

Union-Typ

Mit Union-Typen können Sie Variablen definieren, die einen von mehreren Typen enthalten können.

1let identifier: number | string = "ID_12345";
2console.log(identifier);     // Outputs: ID_12345
3console.log(typeof identifier);  // Outputs: string
4
5identifier = 12345;
6console.log(identifier);     // Outputs: 12345
7console.log(typeof identifier);  // Outputs: number

Zusammenfassung

number, string, boolean: Primitive Typen.
null, undefined: Spezielle Werte.
Array: Ein Array mit Typannotationen.
Tuple: Ein Array mit Elementen unterschiedlicher Typen.
enum: Ein Aufzählungstyp.
any: Beliebiger Typ.
Union: Eine Variable, die einen von mehreren Typen annehmen kann.

Durch die Verwendung dieser Datentypen verbessert TypeScript die Typsicherheit, was es einfacher macht, Fehler während der Entwicklung zu vermeiden.

Wrapper-Objekte

Wrapper-Objekte in TypeScript sind Objekte, die automatisch erstellt werden, um primitive Datentypen als Objekte zu behandeln. Primitive Typen ermöglichen leichte und schnelle Operationen, während Objekttypen über Methoden und Eigenschaften verfügen, die umfangreichere Operationen ermöglichen.

In JavaScript (und TypeScript) gibt es Wrapper-Objekte, die den primitiven Typen wie string, number und boolean entsprechen. Diese werden durch Konstruktorfunktionen namens String, Number und Boolean erstellt.

Im Folgenden sind Beispiele für Wrapper-Objekte aufgeführt.

String-Objekt

Das String-Objekt stellt Eigenschaften und Methoden für Strings bereit.

1let strPrimitive: string = "Hello, World!";
2let strObject: String = new String("Hello, World!");
3
4console.log(strPrimitive);         // Outputs: Hello, World!
5console.log(typeof strPrimitive);  // Outputs: string
6
7console.log(strObject);            // Outputs: [String: 'Hello, World!']
8console.log(typeof strObject);     // Outputs: object

Merkmale:

Im Gegensatz zum primitiven string wird ein String-Objekt von typeof als object behandelt.
Wrapper-Objekte sind nützlich, wenn Strings manipuliert oder Methoden für sie aufgerufen werden.

Number-Objekt

Das Number-Objekt stellt Eigenschaften und Methoden für Zahlen bereit.

1let numPrimitive: number = 42;
2let numObject: Number = new Number(42);
3
4console.log(numPrimitive);         // Outputs: 42
5console.log(typeof numPrimitive);  // Outputs: number
6
7console.log(numObject);            // Outputs: [Number: 42]
8console.log(typeof numObject);     // Outputs: object

Merkmale:

Das Number-Objekt als Wrapper für Zahlen enthält Methoden für numerische Operationen (z. B. toFixed).

Boolean-Objekt

Das Boolean-Objekt stellt Eigenschaften und Methoden für Boolesche Werte bereit.

1let boolPrimitive: boolean = true;
2let boolObject: Boolean = new Boolean(true);
3
4console.log(boolPrimitive);        // Outputs: true
5console.log(typeof boolPrimitive); // Outputs: boolean
6
7console.log(boolObject);           // Outputs: [Boolean: true]
8console.log(typeof boolObject);    // Outputs: object

Merkmale:

Das Boolean-Objekt ist ein Wrapper für den primitiven Typ boolean und wird als object behandelt.

Unterschiede zwischen Wrapper-Objekten und primitiven Typen

Da Wrapper-Objekte als Objekte behandelt werden, gibt es einen leichten Performanceverlust, aber aufgrund zusätzlicher Eigenschaften und Methoden sind funktionalere Operationen möglich. Außerdem gibt es Unterschiede beim Vergleich mittels == und ===.

1let numPrimitive: number = 123;
2let numObject: Number = new Number(123);
3
4console.log('==  : ', numPrimitive == numObject);  // Outputs: true (Value comparison)
5console.log('=== : ', numPrimitive === numObject); // Outputs: false (Due to differing types)

Merkmale:

== vergleicht Werte, während === einen strikt typengeprüften Vergleich vornimmt. === gibt false zurück, wenn Wrapper-Objekte mit primitiven Typen verglichen werden.

Typumwandlung

In TypeScript ist es wichtig, implizite und explizite Typumwandlungen ordnungsgemäß zu handhaben.

Implizite Typumwandlung

In TypeScript sollten implizite Typumwandlungen so weit wie möglich vermieden werden, um die Typsicherheit zu gewährleisten.

1const result: string = 5 + "5"; // "55" (the number is converted to a string)
2
3console.log(result);

In diesem Beispiel wird die Zahl 5 implizit in einen String umgewandelt, was zu dem String "55" führt.

Explizite Typumwandlung

In TypeScript sollten Typannotationen oder Typumwandlungsfunktionen verwendet werden, um Typumwandlungen sicher durchzuführen.

1const num: string = "123";
2const convertedNum: number = Number(num); // Converts "123" to the number 123
3
4console.log(typeof num);
5console.log(typeof convertedNum);

In diesem Beispiel wird die Number()-Funktion verwendet, um den String "123" explizit in die Zahl 123 umzuwandeln.

Typprüfung

In TypeScript können Sie den Operator typeof verwenden, um den Datentyp einer Variablen zu prüfen.

 1// Output: The type of 42 is: number
 2console.log('The type of 42             is:', typeof 42);
 3
 4// Output: The type of 42 is: bigint
 5console.log('The type of 42n            is:', typeof 42n);
 6
 7// Output: The type of "hello" is: string
 8console.log('The type of "hello"        is:', typeof "hello");
 9
10// Output: The type of true is: boolean
11console.log('The type of true           is:', typeof true);
12
13// Output: The type of undefined is: undefined
14console.log('The type of undefined      is:', typeof undefined);
15
16// Output: The type of null is: object
17console.log('The type of null           is:', typeof null);
18
19// Output: The type of Symbol() is: symbol
20console.log('The type of Symbol()       is:', typeof Symbol());
21
22// Output: The type of {} is: object
23console.log('The type of {}             is:', typeof {});
24
25// Output: The type of function () {} is: function
26console.log('The type of function () {} is:', typeof function () {});

In TypeScript können Sie typeof zur Typprüfung verwenden, aber für genauere Typprüfungen wird auch empfohlen, die Operatoren instanceof oder is zu verwenden.

Zusammenfassung

Wrapper-Objekte werden als Objekte behandelt, da sie zusätzliche Methoden und Eigenschaften für primitive Typen bereitstellen.
String, Number und Boolean sind repräsentative Beispiele für Wrapper-Objekte.
Im Gegensatz zu primitiven Typen werden Wrapper-Objekte von typeof als object identifiziert.

Sie können den obigen Artikel mit Visual Studio Code auf unserem YouTube-Kanal verfolgen. Bitte schauen Sie sich auch den YouTube-Kanal an.

YouTube Video

Grundlagen von TypeScript Operatoren in TypeScript