Thomas Claudius Huber Trivadis AG

Mit Modulen lassen sich auch große Anwendungen realisieren, ohne dass es zu Überlappungen von Klassennamen oder Funktionsnamen kommt.

In JavaScript – und somit auch in TypeScript – lässt sich funktional programmieren. Für die Parameter einer Funktion bietet TypeScript verschiedene Optionen an: Neben den benötigten Parametern gibt es auch optionale Parameter, Parameter mit Defaultwerten und so genannte Rest-Parameter. Dieser Artikel zeigt die einzelnen Varianten und beschreibt, wie ein Interface für Funktionen definiert wird und – ganz wichtig! – wie das Schlüsselwort this in Funktionen verwendet wird. Damit kommen auch die Arrow Functions ins Spiel.

In JavaScript, und so auch in TypeScript, gibt es prinzipiell zwei Arten von Funktionen: benannte und anonyme. Eine benannte Funktion trägt einen Namen. Folgende multiply-Funktion ist beispielsweise eine benannte Funktion, da nach dem function-Schlüsselwort der Name multiply folgt:

 function multiply(x, y) {

    return x * y;

 }.

Artikelserie

Teil 1: TypeScript – Grundlagen für .NET-Entwickler

Teil 2: Von „number“ über Arrays bis „undefined“

Teil 3: TypeScript – Interfaces, Klassen und Generics

Teil 4: TypeScript – Funktionen

Teil 5: TypeScript – Module

Teil 6: TypeScript – Decorators

Teil 7: TypeScript in Angular

TypeScript-Video-Tutorial

Von Thomas Claudius Huber gibt es auf www.tutorials.entwickler.de auch ein ausführliches Video-Tutorial zur Einführung in TypeScript.

Neben benannten Funktionen gibt es auch anonyme Funktionen. Sie besitzen selbst keinen Namen, das heißt, nach dem function-Schlüsselwort folgt nicht – wie im Fall der multiply-Funktion – ein Name, sondern direkt die öffnende Klammer mit den Funktionsparametern. Folgende anonyme Funktion wird in der add-Variable gespeichert. Dabei ist zu sehen, dass bei der anonymen Funktion nach dem function-Schlüsselwort kein Name folgt:

let add = function(x, y) { return x + y; };

Die der add-Variable zugewiesene anonyme Funktion lässt sich über die Variable aufrufen. Das sieht nicht anders aus als bei einer benannten Funktion:

let resultMul = multiply(3, 3);

let resultAdd = add(3, 3);

Anstatt eine anonyme Funktion in einer Variable zu speichern, lässt sich eine Funktion auch als Parameter an eine andere Funktion übergeben. Auf diese Art und Weise lässt sich in JavaScript und somit auch in TypeScript funktional programmieren.

Typen hinzufügen

Um in TypeScript Compile-Fehler zu erhalten, müssen Parameter von Funktionen natürlich mit Typen ausgestattet sein. Ansonsten haben diese Parameter implizit den Typ any und können somit einen x-beliebigen Wert enthalten. Das heißt im Umkehrschluss, dass es nie einen Compile-Fehler geben kann, da eben alles gültig ist. Das folgende Beispiel zeigt die anonyme Funktion zum Addieren, diesmal mit zwei Parametern vom Typ number. Auch der Rückgabewert der Funktion ist als number definiert.

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

Der Rückgabewert müsste im oberen Fall nicht explizit definiert werden, da der TypeScript-Compiler ihn selbst ermitteln kann. Zur Lesbarkeit des Codes ist die explizite Angabe des Rückgabewerts in einigen Fällen jedoch besser. Zu beachten ist, dass die add-Variable keine Typangabe enthält. Der TypeScript-Compiler kann den Typ der add-Variable aufgrund der Zuweisung der Funktion ermitteln. Allerdings kann der Typ auch explizit angegeben werden, wie das folgende Beispiel zeigt. Interessant ist dabei, dass der Rückgabewert bei der Typangabe mit einem Pfeil (=>) angegeben wird und nicht wie auf der Funktion selbst mit einem Doppelpunkt.

Den vollständigen Artikel lesen Sie in der Ausgabe:

Windows Developer 7.17 - "Apps - fix und praktisch"

Alle Infos zum Heft
579801757Funktionen in TypeScript richtig einsetzen
X
- Gib Deinen Standort ein -
- or -