Lektionen des Moduls (1/2)
Primitive Typen und Annotationen
TypeScript ist ein typisiertes Superset von JavaScript, was bedeutet, dass es eine Syntax für statische Typen über die bestehende JavaScript-Syntax legt. Zur Laufzeit wird der gesamte TypeScript-Code in reines JavaScript kompiliert, und die Typen verschwinden während des Builds vollständig.
Dank TypeScript können Sie Fehler erkennen, bevor der Code im Browser ausgeführt wird, was die Entwicklung robuster, sicherer und skalierbarer macht.
Die primitiven Typen
TypeScript unterstützt die standardmäßigen primitiven Typen von JavaScript:
string: Repräsentiert Zeichenfolgen (z. B.'Alice',"Hello").number: Repräsentiert numerische Werte, sowohl Ganzzahlen als auch Dezimalzahlen (z. B.42,3.14).boolean: Repräsentiert Wahrheitswerte (trueoderfalse).nullundundefined: Repräsentieren das bewusste oder unbewusste Fehlen eines Wertes.
const username: string = 'Alice';
const score: number = 100;
const isActive: boolean = true;Variablenannotationen und Inferenz
In TypeScript können wir eine Typannotation hinzufügen, indem wir einen Doppelpunkt (:) gefolgt vom Typ eingeben.
Wenn Sie versuchen, einen Wert eines anderen Typs zuzuweisen (z. B. das Zuweisen eines Strings zu einer als number definierten Variablen age), meldet der TypeScript-Compiler sofort einen Fehler vor der Ausführung.
Die Gefahr des Typs any
Der Typ any ist ein spezieller Typ, der TypeScript anweist, die Typprüfung für eine bestimmte Variable zu deaktivieren.
let data: any = 42;
data = 'Hello'; // Nessun errore!
data.nonExistentMethod(); // Nessun errore a tempo di compilazione, ma crash a runtime!Die Verwendung von any hebt alle Sicherheitsvorteile von TypeScript auf. Es gilt als schlechte Praxis, die im Produktionscode fast immer vermieden werden sollte.
Funktionsannotationen und der Typ void
Wir können sowohl die Parameter als auch den Rückgabewert einer Funktion annotieren:
function calculateTax(price: number, taxRate: number): number {
return price * taxRate;
}Wenn eine Funktion keinen Wert zurückgibt (z. B. nur ein console.log ausführt), ist ihr Rückgabetyp void:
function logMessage(message: string): void {
console.log(message);
}Probier es aus
Esercizio 1: Typisierte Variablen
Deklariere drei explizit typisierte Variablen: username als String mit dem Wert 'Alice', score als Zahl mit dem Wert 100 und isActive als Boolean mit dem Wert true. Verwende nicht den Typ any.
Hinweis anzeigen
Verwende die Syntax : string, : number und : boolean nach dem Namen jeder Variablen.
Lösung nach 3 Versuchen verfügbar
Esercizio 2: Begrüßungsfunktion
Erstelle eine Funktion namens greet, die einen Parameter name vom Typ String akzeptiert und einen String im Format 'Hello, ' gefolgt vom Namen zurückgibt. Spezifiziere explizit sowohl den Typ des Parameters als auch den Rückgabetyp.
Hinweis anzeigen
Deklariere die Funktion als function greet(name: string): string { ... } und gib die Nachricht zurück.
Lösung nach 3 Versuchen verfügbar
Esercizio 3: Temperaturkonverter
Deklariere eine Funktion namens celsiusToFahrenheit, die einen Parameter celsius vom Typ Zahl akzeptiert und die entsprechende Temperatur in Grad Fahrenheit (Zahl) zurückgibt. Die Formel lautet celsius * 9 / 5 + 32. Spezifiziere explizit sowohl den Typ des Parameters als auch den Rückgabetyp.
Hinweis anzeigen
Multipliziere celsius mit 9, dividiere durch 5, addiere 32 und gib das Ergebnis mit der Annotation : number an der Funktion zurück.
Lösung nach 3 Versuchen verfügbar
Esercizio 4: Rabattberechnung
Erstelle eine Funktion namens calculateDiscount, die einen Parameter price vom Typ Zahl und einen Parameter discountPercent vom Typ Zahl akzeptiert und den rabattierten Endpreis als Zahl zurückgibt. Spezifiziere explizit sowohl die Typen der Parameter als auch den Rückgabetyp.
Hinweis anzeigen
Ziehe den Prozentsatz des Rabatts geteilt durch 100 von 1 ab und multipliziere ihn dann mit dem Anfangspreis. Stelle sicher, dass Parameter und Rückgabewert als number annotiert sind.
Lösung nach 3 Versuchen verfügbar