Heim  >  Artikel  >  Web-Frontend  >  Detaillierte Beispiele für die sofortige Ausführung von Funktionen in JavaScript

Detaillierte Beispiele für die sofortige Ausführung von Funktionen in JavaScript

小云云
小云云Original
2017-12-28 09:38:241540Durchsuche

Mit der Funktion „Sofortige Ausführung“ von j können Sie Ihre Funktion sofort nach der Erstellung ausführen. Der Funktionsmodus „Sofortige Ausführung“ von j ist im Wesentlichen ein Funktionsausdruck (benannt oder anonym). unmittelbar nach der Erstellung. Im Vergleich zu anderen Programmiersprachen ist JavaScript relativ lässig, daher ist der JavaScript-Code voller seltsamer Schreibmethoden, die manchmal im Nebel auftauchen. Natürlich ist es auch ein tieferes Verständnis, verschiedene Schreibmethoden verstehen zu können der Eigenschaften der JavaScript-Sprache. Dieser Artikel führt Sie hauptsächlich in die relevanten Informationen zur sofortigen Ausführung von Funktionen in JavaScript ein. Freunde, die sie benötigen, können darauf zurückgreifen.

Vorwort

( function(){…} )() und ( function (){…} () ) sind zwei gängige Arten, JavaScript-Funktionen zu schreiben, die sofort ausgeführt werden sollen Sie waren gleich. Wickeln Sie die anonyme Funktion in Klammern, fügen Sie dann am Ende eine Klammer hinzu, um die Funktion aufzurufen, und erreichen Sie schließlich den Zweck, die Funktion sofort nach ihrer Definition auszuführen. Später wurde der Grund für das Hinzufügen der Klammern entdeckt war nicht dasselbe.

Im Folgenden gibt es nicht viel zu sagen, werfen wir einen Blick auf die ausführliche Einführung.

Normalerweise deklarieren wir eine Funktion auf folgende Weise:

// 声明函数f1
function f1() {
 console.log("f1");
}
// 通过()来调用此函数
f1();


//一个匿名函数的函数表达式,被赋值给变量f2:
var f2 = function() {
 console.log("f2");
}
//通过()来调用此函数
f2();


//一个命名为f3的函数的函数表达式(这里的函数名可以随意命名,可以不必和变量f3重名),被赋值给变量f3:
var f3 = function f3() {
 console.log("f3");
}
//通过()来调用此函数
f3();

Wenn Sie einige benutzerdefinierte Steuerelemente gesehen haben, werden Sie feststellen, dass die meisten davon dieser Schreibweise folgen:

(function() {
 "
 // 这里开始写功能需求
 })();

Dies ist das, was wir oft als „Immediate Execution Function“ (IIFE) bezeichnen. Wie der Name schon sagt, bedeutet dies, dass diese Funktion den Funktionskörper sofort ausführt und nicht erfordert, dass Sie ihn aktiv aufrufen Anonyme Funktionen verwenden IIFE. Dies dient zwei Zwecken:

Erstens besteht keine Notwendigkeit, die Funktion zu benennen, wodurch eine Verunreinigung globaler Variablen vermieden wird.

Zweitens wird innerhalb von IIFE ein separater Bereich gebildet , das einige private Variablen kapseln kann, die von der Außenwelt nicht gelesen werden können.

Wenn Sie diese beiden Sätze nicht verstehen können, beginnen wir mit dem Funktionsprinzip von IIFE.

Da IIFE normalerweise für anonyme Funktionen verwendet wird, verwenden wir hier eine einfache anonyme Funktion als Kastanie:

var f = function(){
 console.log("f");
}
f();

Wir stellen fest, dass f hier nur eine Referenzvariable davon ist anonyme Funktion, dann Da f() diese Funktion aufrufen kann, kann ich f durch die Funktion selbst ersetzen:

function(){
 console.log("f"); 
}();

Nach dem Ausführen erhalte ich die folgenden Ergebnisse:

Uncaught SyntaxError: Unexpected token (

The Der Grund für diesen Fehler liegt darin, dass die Javascript-Engine, nachdem sie das Funktionsschlüsselwort erkennt, denkt, dass das, was folgt, eine Funktionsdeklarationsanweisung ist und nicht mit Klammern enden sollte. Die Lösung besteht darin, der Engine mitzuteilen, dass der Teil vor den Klammern keine Funktionsdefinitionsanweisung, sondern ein Ausdruck ist, der bearbeitet werden kann. Hier wird zwischen Funktionsdeklaration und Funktionsausdruck unterschieden:

1. Funktionsdeklaration (Das heißt, wir verwenden normalerweise die Funktion x(){}, um eine Funktion zu deklarieren)

function myFunction () { /* logic here */ }

2. Funktionsausdruck (ähnlich dieser Form)

var myFunction = function () { /* logic here */ };
var myObj = {
 myFunction: function () { /* logic here */ }
};

In der Grundschule haben wir gelernt, dass mit () eingeschlossene Ausdrücke zuerst ausgeführt werden, wie folgt:

1+(2+3) //这里先运行小括号里面的内容没有意见撒

Tatsächlich haben Klammern auch in JavaScript einen ähnlichen Effekt, wenn die Javascript-Engine verwendet wird Wenn Sie das Funktionsschlüsselwort sehen, wird es als Funktionsdeklarationsanweisung betrachtet. Was passiert also, wenn die Javascript-Engine zuerst die Klammern sieht:

//用小括号把函数包裹起来
(function(){
  console.log("f");  
})();

Die Funktion wurde erfolgreich ausgeführt:

f //控制台输出

In diesem Fall denkt die Javascript-Engine, dass es sich um einen Ausdruck und nicht um eine Funktionsdeklaration handelt. Natürlich gibt es viele Möglichkeiten, die Javascript-Engine denken zu lassen, dass es sich um einen Ausdruck handelt:

!function(){}();
+function(){}();
-function(){}();
~function(){}();
new function(){ /* code */ }
new function(){ /* code */ }() // 只有传递参数时,才需要最后那个圆括号。
……

Zurück zur vorherigen Frage: Warum heißt es IIFE? Es vermeidet die Verschmutzung globaler Variablen. Wenn Sie von anderen geschriebene JQuery-Plug-Ins gesehen haben, gibt es normalerweise Code wie diesen:

(function($){
  "
  //插件实现代码
})(jQuery);

Die JQuery hier ist eigentlich der Parameter der anonymen Funktion. Wenn wir „anonym“ aufrufen, ist der anonyme Parameter f(args), oder? Wenn der formale Parameter $ innerhalb der Funktion verwendet wird, hat dies keine Auswirkungen auf die externe Umgebung, da einige Plug-Ins auch das Qualifikationsmerkmal $ verwenden, und Sie können damit innerhalb dieser Funktion herumspielen.

Für das Obige habe ich mich während dieses Prozesses auf die folgenden beiden Artikel bezogen:

Javascript führt eine Funktion sofort aus: Denken Sie noch einmal über function(){}() im Plug-in nach. in

Funktion zur sofortigen Ausführung in JavaScript

Verwandte Empfehlungen:

Analysieren Sie den Operator vor der Funktion, um die Funktion zur sofortigen Ausführung zu implementieren

Detaillierte Erläuterung anonymer, benannter JavaScript-Funktionen und sofortiger Ausführungsfunktionen IIFE

Sofortige Ausführungsfunktionen in JS

Das obige ist der detaillierte Inhalt vonDetaillierte Beispiele für die sofortige Ausführung von Funktionen in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn