TypeScript - Funktionen: Ein Anfängerleitfaden

Hallo, angehende Programmierer! Heute machen wir uns auf eine aufregende Reise in die Welt der TypeScript-Funktionen. Keine Sorge, wenn du noch nie eine Zeile Code geschrieben hast – ich werde dein freundlicher Guide sein, und wir werden dies Schritt für Schritt durchgehen. Am Ende dieses Tutorials wirst du erstaunt sein, was du mit Funktionen in TypeScript alles machen kannst!

Was ist eine Funktion?

Bevor wir uns den Details widmen, lassen wir uns erst einmal klar werden, was eine Funktion ist. Stell dir eine Funktion wie ein wiederverwendbares Rezept vor. Genau wie du ein Rezept befolgst, um einen Kuchen zu backen, ist eine Funktion ein Satz von Anweisungen, der eine bestimmte Aufgabe in deinem Programm ausführt.

Hier ist eine einfache Funktion in TypeScript:

function greet(name: string): string {
return `Hello, ${name}!`;
}

console.log(greet("Alice")); // Ausgabe: Hello, Alice!

In diesem Beispiel ist greet unsere Funktion. Sie nimmt einen name als Eingabe und gibt eine Begrüßungsnachricht zurück. Das : string nach dem Parameter und nach den Klammern zeigt an, dass die Funktion eine Zeichenkette als Eingabe nimmt und eine Zeichenkette zurückgibt.

Optional Parameters

Manchmal möchtest du einen Parameter optional machen. In TypeScript kannst du dies tun, indem du ein ? nach dem Parameternamen hinzufügst.

function introduce(name: string, age?: number): string {
if (age) {
return `Hi, ich bin ${name} und ich bin ${age} Jahre alt.`;
} else {
return `Hi, ich bin ${name}.`;
}
}

console.log(introduce("Bob")); // Ausgabe: Hi, ich bin Bob.
console.log(introduce("Charlie", 30)); // Ausgabe: Hi, ich bin Charlie und ich bin 30 Jahre alt.

In dieser Funktion ist age optional. Wenn er angegeben wird, includieren wir ihn in die Vorstellung; wenn nicht, lassen wir ihn weg.

Rest-Parameter

Rest-Parameter erlauben es dir, mit mehreren Parametern als Array zu arbeiten. Es ist, als würdest du sagen: "Ich weiß nicht, wie viele Zutaten du mir geben wirst, aber ich werde sie alle in meinem Rezept verwenden!"

function makeShake(...fruits: string[]): string {
return `Ich habe einen Shake mit ${fruits.join(", ")}.`;
}

console.log(makeShake("banana")); // Ausgabe: Ich habe einen Shake mit banana.
console.log(makeShake("strawberry", "mango", "kiwi")); // Ausgabe: Ich habe einen Shake mit strawberry, mango, kiwi.

Die Syntax ...fruitsweist TypeScript an, alle bereitgestellten Argumente aufzunehmen und sie in ein Array namens fruits zu platzieren.

Standardparameter

Standardparameter sind wie ein Notfallplan. Wenn jemand keinen Wert angibt, verwenden wir einen Standardwert.

function orderCoffee(size: string = "medium", type: string = "latte"): string {
return `Du hast ein ${size} ${type} bestellt.`;
}

console.log(orderCoffee()); // Ausgabe: Du hast ein medium latte bestellt.
console.log(orderCoffee("groß")); // Ausgabe: Du hast ein groß latte bestellt.
console.log(orderCoffee("klein", "espresso")); // Ausgabe: Du hast ein klein espresso bestellt.

Wenn du keine Größe oder Art angibst, wird standardmäßig ein mittleres Latte bestellt. Wie praktisch!

Anonyme Funktion

Anonyme Funktionen sind wie Geheimagenten – sie haben keinen Namen! Sie werden oft verwendet, wenn du eine schnelle Funktion benötigst, die du nur einmal verwenden wirst.

let greet = function(name: string): string {
return `Hello, ${name}!`;
};

console.log(greet("David")); // Ausgabe: Hello, David!

Hier haben wir eine anonyme Funktion der Variable greet zugewiesen. Wir können greet dann genau wie eine reguläre Funktion verwenden.

Der Function Constructor

Der Function Constructor ist eine Möglichkeit, Funktionen dynamisch zu erstellen. Es ist, als ob du einen Roboter baust, der Aufgaben basierend auf den Anweisungen ausführt, die du ihm gibst.

let multiply = new Function('a', 'b', 'return a * b');

console.log(multiply(4, 5)); // Ausgabe: 20

In diesem Beispiel erstellen wir eine Funktion, die zwei Zahlen multipliziert. Das letzte Argument ist immer der Funktionenkörper, und die übrigen sind die Parameternamen.

Rekursion und TypeScript-Funktionen

Rekursion tritt auf, wenn eine Funktion sich selbst aufruft. Es ist wie bei russischen Puppen – jede Puppe enthält eine kleinere Version von sich selbst.

function countdown(n: number): void {
if (n <= 0) {
console.log("Startschuss!");
} else {
console.log(n);
countdown(n - 1);
}
}

countdown(3);
// Ausgabe:
// 3
// 2
// 1
// Startschuss!

Diese Funktion zählt von einer gegebenen Zahl bis null. Sie ruft sich selbst mit einer kleineren Zahl auf, bis sie null erreicht.

Lambda-Funktionen

Lambda-Funktionen, auch als Pfeilfunktionen bekannt, sind eine Kurzschreibweise für Funktionen. Sie sind wie Texting-Abkürzungen für Funktionen!

let add = (a: number, b: number): number => a + b;

console.log(add(3, 4)); // Ausgabe: 7

Diese kompakte Syntax ist besonders nützlich für kurze, einfache Funktionen.

Syntaktische Variationen

TypeScript bietet verschiedene Möglichkeiten zur Definition von Funktionen. Hier ist eine Tabelle, die die verschiedenen Syntaxen zusammenfasst:

Syntax	Beispiel
Function Declaration	function greet(name: string): string { returnHello, ${name}!; }
Function Expression	let greet = function(name: string): string { returnHello, ${name}!; };
Arrow Function	let greet = (name: string): string =>Hello, ${name}!;
Method in Object	let obj = { greet(name: string): string { returnHello, ${name}!; } };
Async Function	async function fetchData(): Promise<void> { /* ... */ }

Funktionsoverloads

Funktionsoverloads erlauben es dir, mehrere Funktionssignaturen für dieselbe Funktion zu definieren. Es ist, als ob du mehrere Rezepte für dasselbe Gericht hättest, abhängig von den Zutaten, die du hast.

function makeNoise(animal: "cat"): string;
function makeNoise(animal: "dog"): string;
function makeNoise(animal: string): string {
switch(animal) {
case "cat":
return "Miau";
case "dog":
return "Wuff";
default:
return "Unbekanntes Tier";
}
}

console.log(makeNoise("cat")); // Ausgabe: Miau
console.log(makeNoise("dog")); // Ausgabe: Wuff

Diese Funktion kann verschiedene Tierarten handhaben und die entsprechenden Laute machen.

Und das war's! Wir haben heute viel Boden coberter, von grundlegenden Funktionen bis hin zu fortgeschritteneren Konzepten wie Rekursion und Funktionsoverloads. Denke daran, dass das Lernen von Code wie das Lernen einer neuen Sprache ist – es erfordert Übung und Geduld. Habe keine Angst, mit diesen Konzepten zu experimentieren und deine eigenen Funktionen zu erstellen. Bereitwillig wirst du bald komplexe Programme mit Leichtigkeit schreiben. Viel Spaß beim Programmieren und bis zum nächsten Mal!

Credits: Image by storyset