Heim  >  Artikel  >  Web-Frontend  >  Eine kurze Diskussion zur Javascript-Rückruffunktion_Grundkenntnisse

Eine kurze Diskussion zur Javascript-Rückruffunktion_Grundkenntnisse

WBOY
WBOYOriginal
2016-05-16 16:28:341220Durchsuche

Übergeben Sie die Funktion als Parameter an eine andere Funktion. Bei dieser Funktion handelt es sich um die sogenannte Callback-Funktion

Wir stoßen häufig auf Situationen, in denen die A- und B-Schichten eines Projekts von verschiedenen Personen ausgeführt werden. Die A-Schicht ist für die Funktion funA und die B-Schicht für funcB verantwortlich. Wenn Schicht B die Daten eines bestimmten Moduls nutzen möchte, sagt er zu den Mitarbeitern von Schicht A: Ich brauche Sie, um Daten bereitzustellen, die bestimmte Anforderungen erfüllen, und Sie stellen mir eine Schnittstelle zur Verfügung.

Das Personal auf Ebene A sagte: Ich werde Ihnen Daten zur Verfügung stellen, und die Anzeige und Verarbeitung dieser Daten ist Sache von B.
Natürlich kann Schicht B nicht für jeden Bedarf eine Schnittstelle bereitstellen, über die B die Daten abruft, und B schreibt dann eine Funktion, um sie anzuzeigen.

Das heißt, Sie müssen mit anderen Menschen zusammenarbeiten, andere stellen Daten bereit und Sie müssen nicht darauf achten, wie andere Daten erhalten oder erstellen. Sie müssen nur die Daten verarbeiten, die Sie erhalten. Zu diesem Zeitpunkt müssen Sie die Rückruffunktion

verwenden

Daher sind Rückrufe im Wesentlichen ein Entwurfsmuster, und die Entwurfsprinzipien von jQuery (einschließlich anderer Frameworks) folgen diesem Muster.

Ein Beispiel für die Verwendung von Rückrufen bei der Synchronisierung (Blockierung). Der Zweck besteht darin, func2 auszuführen, nachdem die Ausführung des func1-Codes abgeschlossen ist.

Code kopieren Der Code lautet wie folgt:

var func1=function(callback){
//etwas tun.
(callback && typeof(callback) === "function") && callback();
}

func1(func2);
var func2=function(){
}

Beispiel für einen asynchronen Rückruf:

Code kopieren Der Code lautet wie folgt:

$(document).ready(callback);

$.ajax({
URL: „test.html“,
Kontext: document.body
}).done(function() {
          $(this).addClass("done");
}).fail(function() {
alarm("error");
}).always(function() {
warning("complete");
});

Beachten Sie, dass die Ajax-Anfrage zwar asynchron ist, diese Anfrage jedoch vom Browser angefordert wird, um einen neuen Thread zu öffnen. Wenn sich der Status der Anfrage ändert und zuvor ein Rückruf festgelegt wurde, generiert der asynchrone Thread eine Statusänderung Ereignis und platzieren Sie es in „Warten auf Verarbeitung“ in der Verarbeitungswarteschlange der JavaScript-Engine. Siehe: http://www.phpv.net/html/1700.html

Wann wird der Rückruf ausgeführt?

Die Rückruffunktion wird in einer synchronen Situation im Allgemeinen zuletzt ausgeführt, kann jedoch in einer asynchronen Situation nicht ausgeführt werden, da das Ereignis nicht ausgelöst wird oder die Bedingungen nicht erfüllt sind.

Verwendungszwecke der Rückruffunktion

Ressourcenladen: Rückruf ausführen, nachdem JS-Dateien dynamisch geladen wurden, Rückruf ausführen, nachdem Iframe geladen wurde, Ajax-Operationsrückruf, Rückruf ausführen, nachdem das Laden des Bildes abgeschlossen ist, AJAX usw.
DOM-Ereignisse und Node.js-Ereignisse basieren auf dem Rückrufmechanismus (Node.js-Rückrufe können Probleme bei der Verschachtelung mehrschichtiger Rückrufe aufweisen).
Die Verzögerungszeit von setTimeout beträgt 0. Dieser Hack wird häufig verwendet. Die von settimeout aufgerufene Funktion ist tatsächlich die Verkörperung eines Rückrufs
Verkettete Aufrufe: Bei einer Verkettung ist es einfach, verkettete Aufrufe in der Setter-Methode (oder in einer Methode, die selbst keinen Wert zurückgibt) zu implementieren, aber es ist relativ schwierig, verkettete Aufrufe in der Getter-Methode zu implementieren, da Sie dies benötigen Der Werter gibt die von Ihnen benötigten Daten anstelle dieses Zeigers zurück. Wenn Sie eine Kettenmethode implementieren möchten, können Sie dies mithilfe einer Rückruffunktion erreichen
Die Funktionsaufrufe von setTimeout und setInterval erhalten ihre Rückgabewerte. Da beide Funktionen asynchron sind, d Andernfalls geht die Bedeutung von setTimeout und setInterval verloren, sodass die Verwendung von return sinnlos ist und nur Callback verwendet werden kann. Die Bedeutung eines Rückrufs besteht darin, die Agentenfunktion über das Ergebnis der Timer-Ausführung zu informieren, damit sie rechtzeitig verarbeitet werden kann.

Sammeln Sie Informationen online und Sie sollten es selbst verstehen:

Code kopieren Der Code lautet wie folgt:

Funktion fun(num,callback){
If(num<0) {
alarm("Call A Layer Function Processing!");
warning("Daten können nicht negativ sein, Eingabefehler!"); }else if(num==0){
alarm("Call A Layer Function Processing!");
alarm("Dieses Datenelement existiert nicht!");
}else{
alarm("Funktionsverarbeitung der B-Schicht aufrufen!");
         Rückruf(1);
}
}
Funktionstest(){
var num=document.getElementById("score").value;
Fun(num,function(back){ //Anonyme B-Layer-Verarbeitungsfunktion
alarm(:: zurück);
If(num<2)
alarm("Die Zahl ist 1");
          else if(num<=3)
alarm("Die Zahl ist 2 oder 3!");
        sonst
alarm("Die Zahl ist größer als 3!"); })
}


Wenn die Funktion mit der Ausführung von fun beginnt, wird zunächst ermittelt, ob num eine negative Zahl oder Null ist. Andernfalls wird die Verarbeitungsfunktion der B-Schicht ausgeführt. <= 3, >3 und andere Situationen.

Erlebnistipps:

Stellen Sie am besten sicher, dass der Rückruf vorhanden ist und eine Funktionsreferenz oder ein Funktionsausdruck sein muss:

(callback && typeof(callback) === "function") && callback();


var obj={
init: function(callback){
              //TODO...
If(callback && typeof(callback) === "function") && callback()){
               callback('init...');//Callback
}
}


Abschließend: Warum sollten wir Rückruffunktionen verwenden? Die folgende Metapher ist sehr anschaulich und interessant.

Wenn Sie etwas zu tun haben, gehen Sie zum Wohnheim nebenan, um nach Ihren Klassenkameraden zu suchen, und stellen fest, dass sie nicht da sind.

Methode 1: Gehen Sie alle paar Minuten zum Wohnheim nebenan, um zu sehen, ob dort jemand ist

Methode 2: Bitten Sie die Personen, die mit ihm im selben Wohnheim wohnen, Sie anzurufen, wenn sie ihn zurückkommen sehen


Ersteres ist eine Umfrage und letzteres ein Rückruf.

Dann sag mal, kann ich einfach im nächsten Wohnheim warten, bis meine Klassenkameraden zurückkommen?

Ja, es ist nur so, dass Sie Zeit hätten sparen können, um andere Dinge zu tun, aber jetzt müssen Sie sie mit Warten verschwenden. Wandeln Sie den ursprünglichen nicht blockierenden asynchronen Aufruf in einen blockierenden synchronen Aufruf um.

JavaScript-Rückrufe werden in asynchronen Aufrufszenarien verwendet und die Leistung der Verwendung von Rückrufen ist besser als die von Abfragen.

Einfacher:


„Ich gehe jetzt und gebe dir Bescheid, wenn ich ankomme“

Dies ist ein asynchroner Prozess. Während des Prozesses „Ich gehe“ (Funktionsausführung), „Sie“ können Sie „Angekommen“ (Funktionsausführung abgeschlossen) und „Sie benachrichtigen“ (Rückruf) ausführen
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
Vorheriger Artikel:AngularJS-Einführungs-Tutorial zum Aufbau einer Lernumgebung_AngularJSNächster Artikel:AngularJS-Einführungs-Tutorial zum Aufbau einer Lernumgebung_AngularJS

In Verbindung stehende Artikel

Mehr sehen