Detaillierte Erläuterung der JavaScript-Funktionstypen_Javascript-Kenntnisse

In diesem Artikel werden hauptsächlich gewöhnliche Funktionen, anonyme Funktionen und Abschlussfunktionen vorgestellt

Inhaltsverzeichnis

• Gewöhnliche Funktionen: Führt die Eigenschaften gewöhnlicher Funktionen ein: Überschreibungen mit demselben Namen, Argumentobjekte, Standardrückgabewerte usw.
• Anonyme Funktionen: Einführung in die Merkmale anonymer Funktionen: variable anonyme Funktionen, namenlose anonyme Funktionen.
• Verschlussfunktion: Stellt die Merkmale der Verschlussfunktion vor.

1. Gewöhnliche Funktionen
1.1 Beispiel

function ShowName(name) {
  alert(name);
}
 

1.2 Überschreiben von Funktionen mit demselben Namen in Js

In JS werden Funktionen nicht überladen. Wenn Sie Funktionen mit demselben Funktionsnamen und unterschiedlichen Parametersignaturen definieren, überschreiben die späteren Funktionen die vorherigen Funktionen. Beim Aufruf werden nur die folgenden Funktionen aufgerufen.

var n1 = 1;
 
function add(value1) {
  return n1 + 1;
}
alert(add(n1));//调用的是下面的函数，输出：3
 
function add(value1, value2) {
  return value1 + 2;
}
alert(add(n1));//输出：3
 

1.3 Argumente Objekt

arguments ähnelt C#s params und bedient Variablenparameter: Die Anzahl der an die Funktion übergebenen Parameter ist größer als die Anzahl der Parameter bei der Definition.

function showNames(name) {
  alert(name);//张三
  for (var i = 0; i < arguments.length; i++) {
    alert(arguments[i]);//张三、李四、王五
  }
}
showNames('张三','李四','王五');

1.4 Standardrückgabewert der Funktion

Wenn die Funktion keinen Rückgabewert angibt, ist der Standardrückgabewert „undefiniert“

function showMsg() {
}
alert(showMsg());//输出：undefined
　　

2. Anonyme Funktion
2.1 Variable anonyme Funktion

2.1.1 Beschreibung
Variablen und Ereignissen können Funktionen zugewiesen werden.

2.1.2 Beispiel

//变量匿名函数，左侧可以为变量、事件等
var anonymousNormal = function (p1, p2) {
  alert(p1+p2);
}
anonymousNormal(3,6);//输出9

2.1.3 Anwendbare Szenarien
①Vermeiden Sie die Verschmutzung von Funktionsnamen. Wenn Sie zunächst eine Funktion mit einem Namen deklarieren und diese dann einer Variablen oder einem Ereignis zuweisen, missbrauchen Sie den Funktionsnamen.

2.2 Namenlose anonyme Funktion

2.2.1 Beschreibung
Das heißt, wenn die Funktion deklariert wird, folgen ihr die Parameter. Wenn die JS-Syntax diese Funktion analysiert, wird der darin enthaltene Code sofort ausgeführt.

2.2.2 Beispiel

(function (p1) {
  alert(p1);
})(1);

2.2.3 Anwendbare Szenarien
①Es muss nur einmal ausgeführt werden. Wenn der Browser geladen ist, muss die Funktion nur einmal ausgeführt werden und wird später nicht ausgeführt.

3. Verschlussfunktion
3.1 Beschreibung

Angenommen, Funktion A deklariert eine Funktion B innerhalb von Funktion B, Funktion B verweist auf eine Variable außerhalb von Funktion B und der Rückgabewert von Funktion A ist ein Verweis auf Funktion B. Dann ist Funktion B eine Abschlussfunktion.

3.2 Beispiel

3.2.1 Beispiel 1: Globaler Bezug und lokaler Bezug

function funA() {
  var i = 0;
  function funB() { //闭包函数funB
    i++;
    alert(i)
  }
  return funB;
}
var allShowA = funA(); //全局变量引用：累加输出1,2,3,4等
 
function partShowA() {
  var showa = funA();//局部变量引用：只输出1
  showa();
}

allShowA ist eine globale Variable, die auf die Funktion funA verweist. Durch wiederholtes Ausführen von allShowA() werden die akkumulierten Werte von 1, 2, 3, 4 usw. ausgegeben.

Führen Sie die Funktion partShowA() aus, da intern nur die lokale Variable showa als Referenz auf funA deklariert ist. Nach der Ausführung werden aufgrund des Gültigkeitsbereichs die von showa belegten Ressourcen freigegeben.

Der Schlüssel zum Schließen ist der Umfang: Die von globalen Variablen belegten Ressourcen werden erst freigegeben, wenn die Seite wechselt oder der Browser geschlossen wird. Wenn var allShowA = funA() ist, entspricht dies dem Verweis von allShowA auf funB(), sodass die Ressourcen in funB() nicht von GC recycelt werden, sodass auch die Ressourcen in funA() nicht recycelt werden.

3.2.2 Beispiel 2: Parametrische Verschlussfunktion

function funA(arg1,arg2) {
  var i = 0;
  function funB(step) {
    i = i + step;
    alert(i)
  }
  return funB;
}
var allShowA = funA(2, 3); //调用的是funA arg1=2，arg2=3
allShowA(1);//调用的是funB step=1,输出 1
allShowA(3);//调用的是funB setp=3,输出 4

3.2.3 Beispiel 3: Variablenfreigabe innerhalb der übergeordneten Funktion funA

function funA() {
  var i = 0;
  function funB() {
    i++;
    alert(i)
  }
  allShowC = function () {// allShowC引用匿名函数,与funB共享变量i
    i++;
    alert(i)
  }
  return funB;
}
var allShowA = funA();
var allShowB = funA();//allShowB引用了funA，allShowC在内部重新进行了绑定，与allShowB共享变量i

3.3 Anwendbare Szenarien

① Stellen Sie die Sicherheit der Variablen innerhalb der Funktion funA sicher, da auf die Variablen von funA nicht direkt von außen zugegriffen werden kann.

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein.