JavaScript Funktionsdefinitionen

JavaScript verwendet das Schlüsselwortfunction, um Funktionen zu definieren.

Funktionen können durch Deklarationen definiert werden oder auch Ausdrücke sein.

Funktionsdeklarationen

In vorherigen Tutorials haben Sie die Syntax für Funktionsdeklarationen kennengelernt:

function functionName(parameters) {
  执行的代码
}

Eine Funktionsdeklaration wird nicht sofort ausgeführt. Sie wird aufgerufen, wenn wir sie benötigen.

Beispiele

function myFunction(a, b) {
    return a * b;
}

Selbst ausprobieren »

Note Semikolons werden verwendet, um ausführbare JavaScript-Anweisungen zu trennen.
Da eine Funktionsdeklaration keine ausführbare Anweisung ist, endet sie nicht mit einem Semikolon.

Funktionsausdrücke

JavaScript-Funktionen können durch einen Ausdruck definiert werden.

Ein Funktionsausdruck kann in einer Variablen gespeichert werden:

Beispiele

var x = function (a, b) {return a * b};

Selbst ausprobieren »

Nachdem ein Funktionsausdruck in einer Variablen gespeichert wurde, kann die Variable auch als Funktion verwendet werden:

Beispiele

var x = function (a, b) {return a * b};
var z = x(4, 3);

Selbst ausprobieren »

The above function is actually ananonyme Funktion(eine Funktion ohne Namen).

In Variablen gespeicherte Funktionen benötigen keine Funktionsnamen. Sie werden normalerweise über den Variablennamen aufgerufen.

Note Die obige Funktion endet mit einem Semikolon, weil sie eine ausführbare Anweisung ist.

Der Function()-Konstruktor

In the above examples, we learned that functions are defined by the keywordfunctiondefiniert werden.

Funktionen können auch mit dem integrierten JavaScript-Funktionskonstruktor (Function()) definiert werden.

Beispiele

var myFunction = new Function("a", "b", "return a * b");

var x = myFunction(4, 3);

Selbst ausprobieren »

Eigentlich muss man nicht die Konstruktorfunktion verwenden. Das obige Beispiel kann wie folgt geschrieben werden:

Beispiele

var myFunction = function (a, b) {return a * b};

var x = myFunction(4, 3);

Selbst ausprobieren »

Note In JavaScript muss man oft vermeiden, dasnewSchlüsselwort zu verwenden.

Funktions-Hoisting

In vorherigen Tutorials haben wir bereits etwas über "Hoisting" gelernt.

Hoisting ist das Standardverhalten von JavaScript, den aktuellen Gültigkeitsbereich an den Anfang zu verschieben.

Hoisting gilt für Variablendeklarationen und Funktionsdeklarationen.

Daher können Funktionen aufgerufen werden, bevor sie deklariert werden:

myFunction(5);

function myFunction(y) {
    return y * y;
}

Funktionen, die mithilfe von Ausdrücken definiert werden, können nicht gehoistet werden.

Selbstaufrufende Funktionen

Funktionsausdrücke können "selbstaufrufend" sein.

Ein selbstaufrufender Ausdruck wird automatisch aufgerufen.

Wenn auf den Ausdruck () folgt, wird er aufgerufen.

Deklarierte Funktionen können nicht selbst aufgerufen werden.

Durch das Hinzufügen von Klammern zeigen Sie an, dass es sich um einen Funktionsausdruck handelt:

Beispiele

(function () {
var x = "Hello!!"; // Ich werde mich selbst aufrufen
})();

Selbst ausprobieren »

Die obige Funktion ist tatsächlich eineanonyme selbstaufrufende Funktion(ohne Funktionsnamen).

Funktionen können als Werte sein

JavaScript-Funktionen können als Wert verwendet werden:

Beispiele

function myFunction(a, b) {
    return a * b;
}

var x = myFunction(4, 3);

Selbst ausprobieren »

JavaScript-Funktionen können als Ausdrücke verwendet werden:

Beispiele

function myFunction(a, b) {
    return a * b;
}

var x = myFunction(4, 3) * 2;

Selbst ausprobieren »

Funktionen sind Objekte

In JavaScript gibt dertypeof-Operator zur Überprüfung des Funktionstyps "function" zurück.

Aber es ist genauer, JavaScript-Funktionen als Objekte zu beschreiben.

JavaScript-Funktionen habenEigenschaftenundMethoden。

Die Eigenschaft arguments.length gibt die Anzahl der Argumente zurück, die während des Funktionsaufrufs empfangen wurden:

Beispiele

function myFunction(a, b) {
    return arguments.length;
}

Selbst ausprobieren »

Die toString()-Methode gibt die Funktion als Zeichenkette zurück:

Beispiele

function myFunction(a, b) {
    return a * b;
}

var txt = myFunction.toString();

Selbst ausprobieren »

Pfeilfunktionen

ES6 führte Pfeilfunktionen ein.

Die Syntax von Pfeilfunktionsausdrücken ist prägnanter als die von regulären Funktionsausdrücken.

(参数1, 参数2, …, 参数N) => { 函数声明 }

(参数1, 参数2, …, 参数N) => 表达式(单一)
// 相当于：(参数1, 参数2, …, 参数N) =>{ return 表达式; }

Wenn es nur einen Parameter gibt, sind Klammern optional:

(single parameter) => { function declaration }
single parameter => { function declaration }

Funktionen ohne Parameter sollten mit einem Paar Klammern geschrieben werden:

() => { function declaration }

Beispiele

// ES5 var x = function(x, y) { return x * y; } // ES6 const x = (x, y) => x * y;

Selbst ausprobieren »

Einige Arrow-Funktionen haben kein eigenesthis.Nicht geeignet zum Definieren einer。

Objektmethode.

Wenn wir Arrow-Funktionen verwenden, bindet die Arrow-Funktion automatisch den Wert des äußeren this für uns, sodass in einer Arrow-Funktion der Wert von this derselbe ist wie das äußere this.

Die Verwendung vonconstanstelle vonvarist sicherer, weil Funktionsausdrücke immer eine Konstante sind.

Wenn der Funktionskörper nur eine einzelne Anweisung ist, kannst du das return-Schlüsselwort und die geschweiften Klammern {} weglassen, was eine gute Angewohnheit ist:

Beispiele

const x = (x, y) => { return x * y };

Selbst ausprobieren »

Hinweis:IE11 und frühere IE-Versionen unterstützen keine Arrow-Funktionen.

Andere Erweiterungen