TypeScript Funktionen: Typisierung und funktionale Konzepte

Funktionen sind in TypeScript ein zentrales Element, und die Typisierung macht sie noch leistungsfähiger. Durch die genaue Angabe von Typen bei Parametern und Rückgabewerten können Fehler frühzeitig erkannt und die Codequalität verbessert werden. In diesem Artikel schauen wir uns an, wie man Funktionen typisiert, mit optionalen und Default-Parametern arbeitet, Rückgabewerte definiert und Arrow Functions nutzt.

Typisierte Funktionen

In TypeScript können Funktionen sowohl Parameter als auch Rückgabewerte explizit typisiert werden. Das ermöglicht eine präzise Kontrolle darüber, welche Werte eine Funktion erwartet und was sie zurückgibt. Hier ein einfaches Beispiel:

function add(x: number, y: number): number {
  return x + y;
}

In diesem Fall erwarten wir, dass `add` zwei Parameter vom Typ `number` erhält und einen `number`-Wert zurückgibt. Sollten wir versuchen, etwas anderes zu übergeben, wird TypeScript einen Fehler ausgeben.

Funktionen können auch ohne einen expliziten Rückgabewert verwendet werden, indem der Rückgabewert als `void` deklariert wird:

function logMessage(message: string): void {
  console.log(message);
}

`void` gibt an, dass die Funktion keinen Wert zurückgibt, was bei Funktionen wie `logMessage`, die nur eine Aktion ausführen, oft der Fall ist.

Optionale und Default-Parameter

In TypeScript können Funktionsparameter als optional gekennzeichnet oder mit Standardwerten versehen werden. Das gibt Flexibilität bei der Funktionsdefinition und ermöglicht es, dass bestimmte Parameter nicht immer übergeben werden müssen.

Um einen Parameter als optional zu kennzeichnen, fügt man dem Parameternamen ein Fragezeichen hinzu (`?`). Wenn ein optionaler Parameter nicht übergeben wird, ist dessen Wert `undefined`.

function greet(name: string, greeting?: string): string {
  return greeting ? `${greeting}, ${name}!` : `Hello, ${name}!`;
}
console.log(greet("Philipp")); // Ausgabe: Hello, Philipp!
console.log(greet("Philipp", "Hi")); // Ausgabe: Hi, Philipp!

In diesem Beispiel ist `greeting` optional. Wird kein Gruß übergeben, wird automatisch „Hello“ verwendet. Bei Default-Parametern kann ein Standardwert festgelegt werden, der verwendet wird, wenn kein Argument für diesen Parameter übergeben wird.

  function multiply(a: number, b: number = 2): number {
    return a * b;
  }
  console.log(multiply(5)); // Ausgabe: 10 (weil b standardmäßig 2 ist)
  console.log(multiply(5, 3)); // Ausgabe: 15

Hier ist der Parameter `b` standardmäßig `2`, wenn kein anderer Wert angegeben wird.

Rückgabewerte von Funktionen

Wie bei den Parametern können auch die Rückgabewerte von Funktionen in TypeScript typisiert werden. Dies sorgt dafür, dass die Funktion nur den definierten Typ zurückgibt, was die Fehleranfälligkeit im Code reduziert.

function getLength(str: string): number {
  return str.length;
}

In diesem Beispiel wird die Funktion `getLength` typisiert, sodass sie garantiert einen `number`-Wert zurückgibt. Wenn der Rückgabewert nicht mit dem angegebenen Typ übereinstimmt, gibt TypeScript eine Fehlermeldung aus.

Es ist auch möglich, dass eine Funktion mehrere Typen als Rückgabewerte haben kann. Dies geschieht mit Union Types:

function getID(id: string | number): string | number {
  return id;
}

In diesem Fall kann die Funktion sowohl einen `string` als auch eine `number` zurückgeben, je nachdem, was als Argument übergeben wurde.

Arrow Functions und Typisierung

Arrow Functions sind eine kürzere Syntax für Funktionen in TypeScript und JavaScript. Sie sind besonders nützlich für kurze Funktionen und haben außerdem eine andere Handhabung des `this`-Kontexts. In TypeScript können auch Arrow Functions typisiert werden, was dieselben Regeln wie bei herkömmlichen Funktionen beachtet.

Hier ist ein Beispiel einer typisierten Arrow Function:

const add = (x: number, y: number): number => x + y;

In diesem Beispiel verwenden wir die Arrow Function Syntax mit typisierten Parametern (`x: number, y: number`) und einem typisierten Rückgabewert (`: number`).

Arrow Functions sind besonders nützlich in Zusammenhang mit Arrays oder bei Funktionen, die als Argumente an andere Funktionen übergeben werden. Zum Beispiel:

const numbers = [1, 2, 3, 4];
const doubled = numbers.map((n: number): number => n * 2);
console.log(doubled); // Ausgabe: [2, 4, 6, 8]

In diesem Fall wird eine Arrow Function verwendet, um jedes Element des Arrays zu verdoppeln. Der Typ `n: number` wird explizit angegeben, um sicherzustellen, dass die Arrow Function nur `number`-Werte akzeptiert.

Fazit

Typisierte Funktionen sind in TypeScript ein wichtiger Bestandteil, um den Code sicherer und besser lesbar zu machen. Durch optionale und Default-Parameter wird die Flexibilität bei der Definition von Funktionen erhöht, und die Möglichkeit, Rückgabewerte zu typisieren, reduziert mögliche Fehler. Arrow Functions bieten eine elegante und kurze Möglichkeit, Funktionen zu schreiben und erlauben es Entwicklern, sauberen und prägnanten Code zu verfassen. Mit diesen Funktionalitäten stellt TypeScript sicher, dass Funktionen klar definiert und leicht wartbar bleiben, insbesondere in großen Projekten.