Eingehende Analyse der Javascript-Fähigkeiten zur sofortigen Ausführung von Funktionen_Javascript

Javascript ist lockerer als andere Programmiersprachen, daher ist der JavaScript-Code voller allerlei seltsamer Schreibmethoden, die manchmal im Nebel auftauchen;
Natürlich ist die Fähigkeit, verschiedene Schreibweisen zu verstehen, auch ein tiefergehendes Verständnis der Eigenschaften der JavaScript-Sprache.

JavaScript-Funktionssyntax

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

Funktion Funktionsname()
{
Hier ist der Code zum Ausführen von
}

Wenn diese Funktion aufgerufen wird, wird der Code innerhalb der Funktion ausgeführt.

Funktionen können direkt aufgerufen werden, wenn ein Ereignis auftritt (z. B. wenn der Benutzer auf eine Schaltfläche klickt) und können von überall aus über JavaScript aufgerufen werden.

Tipp: Bei JavaScript wird die Groß-/Kleinschreibung beachtet. Das Schlüsselwort function muss in Kleinbuchstaben geschrieben sein und die Funktion muss mit der gleichen Groß-/Kleinschreibung wie der Funktionsname aufgerufen werden.

( function(){…} )() und ( function (){…} () ) sind zwei gängige Methoden zum Schreiben von JavaScript-Funktionen, um Funktionen sofort auszuführen;

Zuerst dachte ich, es sei eine anonyme Funktion in Klammern, und dann wurde am Ende eine Klammer hinzugefügt, um die Funktion aufzurufen. Schließlich wurde der Zweck erreicht, die Funktion sofort nach ihrer Definition auszuführen.
Später stellte sich heraus, dass dies nicht der Grund für die Klammern war. Um die unmittelbare Ausführung von Funktionen zu verstehen, müssen Sie zunächst einige grundlegende Funktionskonzepte verstehen.

Funktionsdeklaration, Funktionsausdruck, anonyme Funktion

Funktionsdeklaration: function fnName () {…}; Verwenden Sie das Schlüsselwort function, um eine Funktion zu deklarieren, und geben Sie dann einen Funktionsnamen an, der als Funktionsdeklaration bezeichnet wird.

Funktionsausdruck: var fnName = function () {…}; Verwenden Sie das Funktionsschlüsselwort, aber geben Sie der Funktion keinen Namen. Weisen Sie schließlich die anonyme Funktion einer Variablen zu, die als Funktionsausdruck bezeichnet wird ist die häufigste Form der Ausdruckssyntax.

Anonyme Funktion: function () {}; Verwenden Sie das Schlüsselwort function, um der Funktion einen Namen zu geben. Daher werden anonyme Funktionen als Funktionsausdrücke bezeichnet Bei der Zuweisung zu einer Variablen wird eine Funktion erstellt, die Zuweisung eines Ereignisses wird zu einem Ereignishandler oder es wird ein Abschluss erstellt usw.

Der Unterschied zwischen Funktionsdeklaration und Funktionsausdruck:

1. Wenn die Javascript-Engine den JavaScript-Code analysiert, wird die Funktionsdeklaration in der aktuellen Ausführungsumgebung (Bereich) „angehoben“, und der Funktionsausdruck muss warten, bis die Javascript-Engine die Zeile ausführt, in der sie sich befindet . Erst dann wird der Funktionsausdruck Zeile für Zeile von oben nach unten analysiert;

2. Sie können nach dem Funktionsausdruck Klammern hinzufügen, um die Funktion sofort aufzurufen und können nur in der Form von fnName() aufgerufen werden.

Beispiel:

 fnName(); 
 function fnName(){ 
  ... 
 } 
 //正常,因为"提升"了函数声明,函数调用可在函数声明之前 
 fnName(); 
 var fnName = function(){ 
  ... 
 } //报错,变量fnName还未保存对函数的引用,函数调用必须在函数表达式之后
 var fnName = function(){ 
  alert("Hello World"); 
 }(); 
 //函数表达式后面加括号,当javascript引擎解析到此处时能立即调用函数 
 function fnName(){ 
  alert("Hello World"); 
 }(); 
 //不会报错,但是javascript引擎只解析函数声明,忽略后面的括号,函数声明不会被调用 
 function(){ 
  console.log("Hello World"); 
 }();
 //语法错误,虽然匿名函数属于函数表达式,但是未进行赋值操作, 
//所以javascript引擎将开头的function关键字当做函数声明,

Fehler: Ein Funktionsname ist erforderlich

Nachdem wir einige Grundkonzepte von Funktionen verstanden haben, werfen wir einen Blick zurück auf ( function(){…} )() und ( function (){…} () ), zwei Möglichkeiten, Funktionen zu schreiben, die sofort ausgeführt werden,

Zuerst dachte ich, es sei eine anonyme Funktion in Klammern, gefolgt von einer Klammer, um die Funktion sofort aufzurufen. Ich wusste damals nicht, warum die Klammern hinzugefügt wurden.

Ich habe später verstanden, dass die Funktion ein Funktionsausdruck und keine Funktionsdeklaration sein muss, wenn Sie nach dem Funktionskörper Klammern hinzufügen möchten, um ihn sofort aufzurufen.

 ( function(a){ 
  console.log(a); //firebug输出123,使用()运算符 
 })(123); 
 ( function(a){ 
  console.log(a); //firebug输出1234,使用()运算符 
 }(1234)); 
 ! function(a){ 
  console.log(a); //firebug输出12345,使用！运算符 
 }(12345); 
 + function(a){ 
  console.log(a); //firebug输出123456,使用+运算符 
 }(123456); 
 - function(a){ 
  console.log(a); //firebug输出1234567,使用-运算符 
 }(1234567); 
 var fn= function(a){ 
  console.log(a); //firebug输出12345678,使用=运算符 
 }(12345678)

Um die Ausgabe zu sehen, fügen Sie sie vor der Funktion ein! , , - oder sogar Kommas können dazu führen, dass die Funktion unmittelbar nach ihrer Definition ausgeführt wird, und (),! Operatoren wie , , - und = konvertieren alle Funktionsdeklarationen in Funktionsausdrücke, wodurch die Mehrdeutigkeit zwischen der JavaScript-Engine bei der Identifizierung von Funktionsausdrücken und Funktionsdeklarationen beseitigt wird und der JavaScript-Engine mitgeteilt wird, dass es sich um einen Funktionsausdruck und nicht um eine Funktionsdeklaration handelt und kann später verwendet werden. Fügen Sie Klammern hinzu und führen Sie den Code der Funktion sofort aus.

Das Hinzufügen von Klammern ist der sicherste Weg, denn! Operatoren wie , , - führen auch Operationen mit dem Rückgabewert der Funktion aus, was manchmal unnötige Probleme verursacht.

Aber was nützt es, so zu schreiben?

In JavaScript gibt es kein Konzept eines privaten Bereichs. Wenn ein Projekt von mehreren Personen entwickelt wird und einige Variablen im globalen oder lokalen Bereich deklariert werden, können sie von anderen Personen, die versehentlich Variablen mit demselben Namen verwenden, überschrieben werden.

Entsprechend den Merkmalen der JavaScript-Funktionsbereichskette können Sie diese Technologie verwenden, um einen privaten Bereich zu imitieren und anonyme Funktionen als „Container“ zu verwenden. Auf externe Variablen kann innerhalb des „Containers“ zugegriffen werden, die externe Umgebung kann jedoch nicht darauf zugreifen der „Container“ „Interne Variablen, sodass in (function(){...})() definierte Variablen nicht mit externen Variablen in Konflikt geraten, allgemein bekannt als „anonymer Wrapper“ oder „Namespace“.

JQuery verwendet diese Methode und verpackt den JQuery-Code in (Funktion (Fenster, undefiniert){...jQuery-Code...} (Fenster). Wenn Sie den JQuery-Code im globalen Bereich aufrufen, können Sie interne JQuery-Variablen schützen

Der obige Inhalt ist die Funktion zur sofortigen Ausführung von Javascript, die Ihnen der Herausgeber vorgestellt hat.