TypeScript-Funktionen

Eine Funktion ist eine Gruppe von Anweisungen, die gemeinsam eine Aufgabe ausführen.

Sie können Ihren Code in verschiedene Funktionen aufteilen. Wie Sie den Code auf verschiedene Funktionen aufteilen, bleibt Ihnen überlassen, aber logisch betrachtet erfolgt die Aufteilung normalerweise danach, dass jede Funktion eine bestimmte Aufgabe erfüllt.

Eine Funktionsdeklaration teilt dem Compiler den Namen der Funktion, den Rückgabetyp und die Parameter mit. Die Funktionsdefinition stellt den eigentlichen Funktionskörper bereit.

Funktionsdefinition

Eine Funktion ist ein Codeblock, der in geschweifte Klammern eingeschlossen ist und dem das Schlüsselwort function vorangestellt ist:

Die Syntax lautet wie folgt:

function function_name()
{
    // 执行代码
}

Beispiel

TypeScript

function () { //Funktionsdefinition console.log("Aufruf der Funktion") }

Aufruf einer Funktion

Eine Funktion kann den Code in ihrem Inneren nur ausführen, wenn sie aufgerufen wird.

Die Syntax lautet wie folgt:

function_name()

Beispiel

TypeScript

function test() { //Funktionsdefinition console.log("Aufruf der Funktion") } test() //Aufruf der Funktion

Rückgabewert der Funktion

Manchmal möchten wir, dass eine Funktion das Ergebnis ihrer Ausführung an die Stelle zurückgibt, an der sie aufgerufen wurde.

Dies kann durch die Verwendung der return-Anweisung erreicht werden.

Wenn eine return-Anweisung verwendet wird, stoppt die Funktion die Ausführung und gibt den angegebenen Wert zurück.

Die Syntax lautet wie folgt:

function function_name():return_type { 
    // 语句
    return value; 
}

  • return_type ist der Typ des Rückgabewerts.

  • Auf das return-Schlüsselwort folgt das zurückzugebende Ergebnis.

  • Im Allgemeinen hat eine Funktion nur eine return-Anweisung.

  • Der Typ des zurückgegebenen Werts muss mit dem in der Funktion definierten Rückgabetyp (return_type) übereinstimmen.

Beispiel

TypeScript

//Funktionsdefinition function greet():string { //Eine Zeichenkette zurückgeben return "Hello World" } function caller() { var msg = greet() //Die Funktion greet() aufrufen console.log(msg) } //Aufruf der Funktion caller()

  • Im Beispiel wird eine Funktion definiertgreet(), und der Rückgabetyp ist string.

  • greet()Die Funktion kehrt über die return-Anweisung an die Stelle zurück, an der sie aufgerufen wurde, d. h. zur Variablen msg, und gibt dann den Rückgabewert aus.

Kompilieren Sie den obigen Code, um den folgenden JavaScript-Code zu erhalten:

JavaScript

//Funktionsdefinition function greet() { return "Hello World"; } function caller() { var msg = greet(); //Die Funktion greet() aufrufen console.log(msg); } //Aufruf der Funktion caller();

Funktionen mit Parametern

Beim Aufrufen einer Funktion können Werte an sie übergeben werden, und diese Werte werden Parameter genannt.

Diese Parameter können innerhalb der Funktion verwendet werden.

Man kann mehrere Parameter an eine Funktion übergeben, wobei jeder Parameter durch ein Komma getrennt wird,:

Die Syntax lautet wie folgt:

function func_name( param1 [:datatype], param2 [:datatype]) {   
}

  • param1 und param2 sind Parameternamen.

  • datatype ist der Parametertyp.

Beispiel

TypeScript

function add(x: number, y: number): number { return x + y; } console.log(add(1,2))

  • Im Beispiel wird eine Funktion definiertadd(), und der Rückgabetyp ist number.

  • add()Die Funktion definiert zwei Parameter vom Typ number, addiert die beiden Parameter und gibt das Ergebnis zurück.

Kompilieren Sie den obigen Code, um den folgenden JavaScript-Code zu erhalten:

JavaScript

function add(x, y) { return x + y; } console.log(add(1, 2));

Die Ausgabe ist:

3

Optionale und Standardparameter

Optionale Parameter

In TypeScript-Funktionen müssen wir, wenn wir Parameter definieren, diese übergeben, es sei denn, wir legen sie als optional fest. Optionale Parameter werden mit einem Fragezeichen ? gekennzeichnet.

Beispiel

TypeScript

function buildName(firstName: string, lastName: string) { return firstName + " " + lastName; } let result1 = buildName("Bob"); //Fehler, fehlender Parameter let result2 = buildName("Bob", "Adams", "Sr."); //Fehler, zu viele Parameter let result3 = buildName("Bob", "Adams"); //Richtig

Im folgenden Beispiel setzen wir lastName als optionalen Parameter:

TypeScript

function buildName(firstName: string, lastName?: string) { if (lastName) return firstName + " " + lastName; else return firstName; } let result1 = buildName("Bob"); //Richtig let result2 = buildName("Bob", "Adams", "Sr."); //Fehler, zu viele Parameter let result3 = buildName("Bob", "Adams"); //Korrekt

Optionale Parameter müssen nach erforderlichen Parametern stehen. Wenn wir im obigen Beispiel möchten, dass firstName optional und lastName erforderlich ist, müssen wir ihre Positionen anpassen und firstName an die letzte Stelle setzen.

Es spielt keine Rolle, ob alle Parameter optional sind.

Standardparameter

Wir können auch Standardwerte für Parameter festlegen, sodass beim Aufruf der Funktion, wenn der Parameterwert nicht übergeben wird, der Standardparameter verwendet wird. Die Syntax lautet:

function function_name(param1[:type],param2[:type] = default_value) { 
}
Hinweis: Ein Parameter kann nicht sowohl als optional als auch als Standard festgelegt werden.

Beispiel

Im folgenden Beispiel wird der Parameter rate der Funktion auf einen Standardwert von 0.50 gesetzt. Wenn die Funktion aufgerufen wird, ohne den Parameter zu übergeben, wird der Standardwert verwendet:

TypeScript

function calculate_discount(price:number,rate:number = 0.50) { var discount = price * rate; console.log("Berechnungsergebnis:",discount); } calculate_discount(1000) calculate_discount(1000,0.30)

Kompilieren Sie den obigen Code, um den folgenden JavaScript-Code zu erhalten:

JavaScript

function calculate_discount(price, rate) { if (rate === void 0) { rate = 0.50; } var discount = price * rate; console.log("Berechnungsergebnis:", discount); } calculate_discount(1000); calculate_discount(1000, 0.30);

Die Ausgabe ist:

计算结果:  500
计算结果:  300

Rest-Parameter

Es gibt Situationen, in denen wir nicht wissen, wie viele Parameter an eine Funktion übergeben werden müssen. In solchen Fällen können wir Rest-Parameter verwenden, um sie zu definieren.

Die Syntax für Rest-Parameter ermöglicht es uns, eine unbestimmte Anzahl von Parametern als Array zu übergeben.

TypeScript

function buildName(firstName: string, ...restOfName: string[]) { return firstName + " " + restOfName.join(" "); } let employeeName = buildName("Joseph", "Samuel", "Lucas", "MacKinzie");

Der letzte benannte Parameter der Funktion, restOfName, wird mit ... präfixiert, und er wird zu einem Array, das aus den übrigen Parametern besteht, mit Indexwerten von 0 (inklusiv) bis restOfName.length (exklusiv).

TypeScript

function addNumbers(...nums:number[]) { var i; var sum:number = 0; for(i = 0;i<nums.length;i++) { sum = sum + nums[i]; } console.log("Die Summe ist:",sum) } addNumbers(1,2,3) addNumbers(10,10,10,10,10)

Kompilieren Sie den obigen Code, um den folgenden JavaScript-Code zu erhalten:

JavaScript

function addNumbers() { var nums = []; for (var _i = 0; _i < arguments.length; _i++) { nums[_i] = arguments[_i]; } var i; var sum = 0; for (i = 0; i < nums.length; i++) { sum = sum + nums[i]; } console.log("Die Summe ist:", sum); } addNumbers(1, 2, 3); addNumbers(10, 10, 10, 10, 10);

Die Ausgabe ist:

和为： 6
和为： 50

Anonyme Funktionen

Eine anonyme Funktion ist eine Funktion ohne Funktionsnamen.

Anonyme Funktionen werden zur Programmlaufzeit dynamisch deklariert. Abgesehen davon, dass sie keinen Funktionsnamen haben, sind sie dieselben wie Standardfunktionen.

Wir können eine anonyme Funktion einer Variablen zuweisen, und ein solcher Ausdruck wird zu einem Funktionsausdruck.

Die Syntax lautet wie folgt:

var res = function( [arguments] ) { ... }

Beispiel

Anonyme Funktion ohne Parameter:

TypeScript

var msg = function() { return "hello world"; } console.log(msg())

Kompilieren Sie den obigen Code, um den folgenden JavaScript-Code zu erhalten:

JavaScript

var msg = function () { return "hello world"; }; console.log(msg());

Die Ausgabe ist:

hello world

Anonyme Funktion mit Parametern:

TypeScript

var res = function(a:number,b:number) { return a*b; }; console.log(res(12,2))

Kompilieren Sie den obigen Code, um den folgenden JavaScript-Code zu erhalten:

JavaScript

var res = function (a, b) { return a * b; }; console.log(res(12, 2));

Die Ausgabe ist:

24

Selbstaufrufende anonyme Funktionen

Eine anonyme Funktion kann selbst aufgerufen werden, indem () nach der Funktion verwendet wird:

TypeScript

(function () { var x = "Hello!!"; console.log(x) })()

Kompilieren Sie den obigen Code, um den folgenden JavaScript-Code zu erhalten:

JavaScript

(function () { var x = "Hello!!"; console.log(x) })()

Die Ausgabe ist:

Hello!!

Function-Konstruktor

TypeScript unterstützt auch die Verwendung des in JavaScript integrierten Konstruktors Function() zum Definieren von Funktionen:

Die Syntax lautet wie folgt:

var res = new Function ([arg1[, arg2[, ...argN]],] functionBody)

Parameter description:

  • arg1, arg2, ... argN: Eine Liste von Parametern.
  • functionBody: Ein String, der JavaScript-Anweisungen enthält, die die Funktionsdefinition beinhalten.

Beispiel

TypeScript

var myFunction = new Function("a", "b", "return a * b"); var x = myFunction(4, 3); console.log(x);

Kompilieren Sie den obigen Code, um den folgenden JavaScript-Code zu erhalten:

JavaScript

var myFunction = new Function("a", "b", "return a * b"); var x = myFunction(4, 3); console.log(x);

Die Ausgabe ist:

12

Rekursive Funktionen

Eine rekursive Funktion ist eine Funktion, die sich selbst innerhalb der Funktion aufruft.

Zum Beispiel:
Es war einmal ein Berg, in dem Berg war ein Tempel, in dem Tempel erzählte ein alter Mönch einem kleinen Mönch eine Geschichte! Was war die Geschichte? „Es war einmal ein Berg, in dem Berg war ein Tempel, in dem Tempel erzählte ein alter Mönch einem kleinen Mönch eine Geschichte! Was war die Geschichte? ‚Es war einmal ein Berg, in dem Berg war ein Tempel, in dem Tempel erzählte ein alter Mönch einem kleinen Mönch eine Geschichte! Was war die Geschichte? …‘“

Beispiel

TypeScript

function factorial(number) { if (number <= 0) { //Ausführung stoppen return 1; } else { return (number * factorial(number - 1)); //Ruft sich selbst auf } }; console.log(factorial(6)); //Ausgabe 720

Kompilieren Sie den obigen Code, um den folgenden JavaScript-Code zu erhalten:

JavaScript

function factorial(number) { if (number <= 0) { //Ausführung stoppen return 1; } else { return (number * factorial(number - 1)); //Ruft sich selbst auf } } ; console.log(factorial(6)); //Ausgabe 720

Die Ausgabe ist:

720

Lambda-Funktionen

Lambda-Funktionen werden auch Pfeilfunktionen genannt.

Pfeilfunktionsausdrücke haben eine kürzere Syntax als Funktionsausdrücke.

Eine Funktion mit nur einer Anweisung:

( [param1, param2,…param n] )=>statement;

Beispiel

Das folgende Beispiel deklariert eine Lambda-Ausdrucksfunktion, die die Summe zweier Zahlen zurückgibt:

TypeScript

var foo = (x:number)=>10 + x console.log(foo(100)) //Die Ausgabe ist 110

Kompilieren Sie den obigen Code, um den folgenden JavaScript-Code zu erhalten:

JavaScript

var foo = function (x) { return 10 + x; }; console.log(foo(100)); //Die Ausgabe ist 110

Die Ausgabe ist:

110

Eine Funktion ist ein Anweisungsblock:

( [param1, param2,…param n] )=> {
 
    // 代码块
}

Beispiel

Das folgende Beispiel deklariert eine Lambda-Ausdrucksfunktion, die die Summe zweier Zahlen zurückgibt:

TypeScript

var foo = (x:number)=> { x = 10 + x console.log(x) } foo(100)

Das Kompilieren des obigen Codes erzeugt den folgenden JavaScript-Code:

JavaScript

var foo = function (x) { x = 10 + x; console.log(x); }; foo(100);

Die Ausgabe ist:

110
Wir müssen die Parametertypen nicht angeben; die Typen werden innerhalb der Funktion abgeleitet:

TypeScript

var func = (x)=> { if(typeof x=="number") { console.log(x+"ist eine Zahl") } else if(typeof x=="string") { console.log(x+"ist ein String") } } func(12) func("Tom")

Das Kompilieren des obigen Codes erzeugt den folgenden JavaScript-Code:

JavaScript

var func = function (x) { if (typeof x == "number") { console.log(x + "ist eine Zahl"); } else if (typeof x == "string") { console.log(x + "ist ein String"); } }; func(12); func("Tom");

Die Ausgabe ist:

12 是一个数字
Tom 是一个字符串

Ein einzelner Parameter()ist optional:

TypeScript

var display = x => { console.log("Die Ausgabe ist"+x) } display(12)

Das Kompilieren des obigen Codes erzeugt den folgenden JavaScript-Code:

JavaScript

var display = function (x) { console.log("Die Ausgabe ist" + x); }; display(12);

Die Ausgabe ist:

输出为 12

Wenn keine Parameter vorhanden sind, können leere Klammern verwendet werden:

TypeScript

var disp =()=> { console.log("Funktion aufgerufen"); } disp();

Das Kompilieren des obigen Codes erzeugt den folgenden JavaScript-Code:

JavaScript

var disp = function () { console.log("Funktion wird aufgerufen"); }; disp();

Die Ausgabe ist:

Call function

Funktionsüberladung

Überladen bedeutet, dass Methoden denselben Namen, aber unterschiedliche Parameter haben, und die Rückgabetypen können gleich oder unterschiedlich sein.

Jede überladene Methode (oder jeder Konstruktor) muss eine eindeutige Parameter-Typ-Liste haben.

Unterschiedliche Parametertypen:

function disp(string):void; 
function disp(number):void;

Unterschiedliche Anzahl von Parametern:

function disp(n1:number):void; 
function disp(x:number,y:number):void;

Unterschiedliche Reihenfolge der Parametertypen:

function disp(n1:number,s1:string):void; 
function disp(s:string,n:number):void;

Wenn die Parametertypen unterschiedlich sind, sollte der Parametertyp aufany gesetzt werden。

Wenn die Anzahl der Parameter abweicht, kann man die unterschiedlichen Parameter als optional festlegen.

Beispiel

Das folgende Beispiel definiert unterschiedliche Parametertypen und unterschiedliche Anzahlen von Parametern:

TypeScript

function disp(s1:string):void; function disp(n1:number,s1:string):void; function disp(x:any,y?:any):void { console.log(x); console.log(y); } disp("abc") disp(1,"xyz");

Das Kompilieren des obigen Codes erzeugt den folgenden JavaScript-Code:

JavaScript

function disp(x, y) { console.log(x); console.log(y); } disp("abc"); disp(1, "xyz");

Die Ausgabe ist:

abc
undefined
1
xyz
Weitere Erweiterungen