Heim  >  Artikel  >  Web-Frontend  >  Grundlegendes zu Javascript-Rückruffunktionen

Grundlegendes zu Javascript-Rückruffunktionen

WBOY
WBOYOriginal
2016-05-16 16:23:51950Durchsuche

Übergeben Sie die Funktion als Parameter an eine andere Funktion. Diese Funktion ist 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 Daten aus einem bestimmten Modul verwenden möchte, sagt er zu den Leuten auf 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 erhaltenen Daten bearbeiten. 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 der Verkettung ist es einfach, verkettete Aufrufe in der Zuweisungsmethode (Setter) (oder in einer Methode, die selbst keinen Wert zurückgibt) zu implementieren, aber der Getter (Getter) ist relativ schwierig zu implementieren verkettete Aufrufe, da der Werter statt dieses Zeigers die benötigten Daten zurückgeben muss. Wenn Sie eine verkettete Methode implementieren möchten, können Sie diese mithilfe einer Rückruffunktion implementieren

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) {
Alert("Funktion der Schicht A zur Verarbeitung aufrufen!");
warning("Daten können nicht negativ sein, Eingabefehler!"); }else if(num==0){
Alert("Funktion der Schicht A zur Verarbeitung aufrufen!");
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
}
}


Warum sollten wir schließlich 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.

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:Eine kurze Diskussion über JavaScript-Array-Objekte_GrundkenntnisseNächster Artikel:Eine kurze Diskussion über JavaScript-Array-Objekte_Grundkenntnisse

In Verbindung stehende Artikel

Mehr sehen