JavaScript-Grundlagen: Funktion zur sofortigen Ausführung

Manchmal sieht man erstaunliche Funktionen in JavaScript, wie zum Beispiel im folgenden Screenshot:

Diese Art von Funktion wird automatisch ausgeführt, solange der Browser geladen ist und aufgerufen werden muss. Diese Art von Funktion wurde auch zuvor im Abschluss erwähnt. Sie wird im Allgemeinen als sofort ausgeführte Funktion bezeichnet.

Merkmale der Sofortfunktionen:

• Wird automatisch ausgeführt
• Wird nur einmal ausgeführt

Funktionsformat sofort ausführen

Die Funktion zur sofortigen Ausführung hat im Allgemeinen das folgende Format:

# Format 1 (//W3C empfiehlt dieses Format)
(Funktion (){
 }())
 
#Format 2 (aber das ist eine der am häufigsten verwendeten Methoden)
(Funktion (){
 })();
 

Tatsächlich können wir aus dem Obigen auch ersehen, dass bei der sofortigen Ausführung von Funktionen der Funktionsname im Allgemeinen nicht geschrieben wird, was nicht sehr aussagekräftig ist. Schließlich muss die sofortige Funktion nicht über den Funktionsnamen aufgerufen werden. Dies ähnelt dem Effekt beim wörtlichen Definieren einer Funktion.

Betrachten wir nun ein Beispiel, bei dem Closures und sofort ausgeführte Funktionen kombiniert werden:

var Spaß = (
Funktion(){
  Funktionstest(a,b){
      konsole.log(a+b);
  }    
  Rücklauftest;
}
)()
 

Andere Möglichkeiten, Funktionen sofort auszuführen – Ausdrücke

Die obige Formatdefinition der Funktion wird sofort ausgeführt. Es gibt jedoch auch andere Möglichkeiten, diese Funktion zu implementieren. Beispielsweise entspricht die folgende nicht dem obigen Format.

!Funktion(){
    Konsole.log("Test");
}()

Wir können die beiden Ausgabezeilen sehen. Die erste ist Test, also das Ergebnis der sofortigen Ausführung der Funktion, und True wird ausgegeben, weil davor noch eine zusätzliche Zeile steht! , dies wurde während der impliziten Konvertierung erwähnt, in! Das Folgende erzwingt einen Zeilenumbruch vom Typ Boolean.

Nun stellt sich eine weitere Frage: Warum kann diese Methode implementiert werden?

Um zu analysieren, wie dies geschieht, schauen wir uns zunächst eine Ausdrucksfunktion an:

var test = funktion(){
    console.log("Testausdruck")
}
#Wie wird es nach dieser Erklärung verwendet? Wie folgt test();
 

Zu diesem Zeitpunkt kam mir eine mutige Idee. Die zugewiesene Funktion kann ausgeführt werden, indem der Variablenwert zu () hinzugefügt wird. Warum kann sie also nicht direkt geschrieben werden?

var test = funktion(){
    console.log("Testausdruck")
}()

Hier sehen wir, dass die Ausdrucksfunktion auch eine sofortige Ausführungswirkung hat.

(Zusatzinformation: Warum steht dort „undefined“? Weil diese Funktion selbst keinen Rückgabewert hat, daher wird im Konsolenfenster des Browsers der Wert „undefined“ ausgegeben.)

Ist es in Ordnung, Klammern direkt nach der Funktion zu setzen?

Funktion(){
    console.log("Testausdruck")
}()

Es ist ersichtlich, dass Sie die Ausdrucksprämisse verwenden müssen, bevor Sie () am Ende einfügen können, da sonst ein Fehler gemeldet wird.

Zu diesem Zeitpunkt hatte ich tatsächlich eine kühne Idee! Die folgende Methode konvertiert die Funktion tatsächlich in eine Ausdrucksfunktion, sodass das nachfolgende +() direkt ausgeführt werden kann. Dann habe ich eine mutige Idee. In diesem Fall fügen wir einfach ein Pluszeichen (+) vor die Funktion ein und probieren es aus.

+Funktion(){
    console.log("Testausdruck")
}()
 

Denn das Pluszeichen kann dann:

Natürlich können die sogenannten Multiplikations- und Divisionszeichen nicht realisiert werden. Es gibt ein weiteres magisches Schlüsselwort, das ebenfalls diese magische Wirkung haben kann, nämlich neu und nichtig.

neue Funktion(){
    console.log("Testausdruck")
}()

Eine weitere Sache ist, dass die logischen Operatoren || und && auch verwendet werden können, um zu implementieren

Allerdings muss diesem entsprechend seinen Eigenschaften „true“ oder „false“ vorangestellt werden, und es kann nicht allein verwendet werden.

1 && Funktion(){
    console.log("Testausdruck")
}()
 oder 0 || function(){
    console.log("Testausdruck")
}()
 

Es gibt auch ein magisches Symbol (Komma), das diese Funktion erfüllen kann:

1,Funktion(){
    console.log("Testausdruck")
}()
 

Es ist ersichtlich, dass bei Verwendung eines Kommas die folgende Ausdrucksfunktion ausgeführt wird, unabhängig davon, ob die vorherige wahr oder falsch ist.

Sofort ausgeführte Funktionen können Parameter annehmen

Sofort ausgeführte Funktionen können auch Parameter haben, wie folgt:

(Funktion(a,b){
    konsole.log(a,b)
})(1,2)
 

Anwendung

Diese Frage ist eine klassische Interviewfrage. Erstellen Sie zunächst das nächste HTML

<!DOCTYPE html>
<html>
<Kopf> 
<meta charset="utf-8"> 
<title>Prüfung</title> 
</Kopf>
<Text>
<ul id=”test”>
    <li>Das ist das erste</li>
     <li>Dies ist das zweite</li>
    <li>Dies ist der dritte</li>
 </ul>
<Skript>
  var liList = document.getElementsByTagName('li');
     für (var i = 0; i <liList.length; i++)
     {
         liList[i].onclick=Funktion(){
             konsole.log(i);
         }
     };
</Skript>
 </body>
</html>

Der Zweck besteht darin, auf die Anzahl der Etiketten zu klicken, die eine Zahl ausgeben, aber das Ergebnis

Da die For-Schleife bereits abgeschlossen ist, wenn auf „li“ geklickt wird, kann dieses Problem durch die Verwendung des zuvor erlernten Schlüsselworts „let“ gelöst werden.

  var liList = document.getElementsByTagName('li');
     für (lass i = 0; i < liList.length; i++)
     {
         liList[i].onclick=Funktion(){
             konsole.log(i);
         }
     };

Dies kann das Problem lösen, verwendet jedoch nicht die unmittelbare Funktion. Natürlich kann es auch geändert werden, indem die Funktion sofort ausgeführt wird.

 var liList = document.getElementsByTagName('li');
     für (lass i = 0; i < liList.length; i++)
     { (Funktion(a){
        liList[a].onclick=Funktion(){
             konsole.log(a);
         } 
      })(ich)
      };

Es ist ersichtlich, dass die sofort ausgeführte Funktion ihren eigenen geschlossenen Raum bildet, der nicht von anderen externen Variablen beeinflusst wird. Tatsächlich handelt es sich bei einer Rückgabe um einen Standardabschluss.

Zusammenfassen

Dieser Artikel endet hier. Ich hoffe, er kann Ihnen helfen. Ich hoffe auch, dass Sie mehr Inhalt auf 123WORDPRESS.COM lesen können!