Rückrufe und Versprechen | Mit Beispielen erklärt
In diesem Beitrag werden wir sehen, welche Rückrufe und Versprechen in JavaScript mit Hilfe von Beispielen erläutert werden.
Was sind Rückrufe??
Rückrufe sind Funktionen, die in den Argumenten anderer Funktionen übergeben werden. Diese Prozedur gilt in JavaScript, da Funktionen Objekte sind und Objekte als Argumente an Funktionen übergeben werden können. Die Grundstruktur der Rückruffunktion sieht ungefähr so aus.
Funktion DemoFunction (Callback)Ruf zurück();
Ausführungssequenz und Notwendigkeit von Rückrufen
Rückruffunktionen werden verwendet, um die Kontrolle über die Abfolge der Ausführung zu erlangen. Im Allgemeinen werden Funktionen auf der Grundlage der Sequenz ausgeführt, die sie aufgerufen werden, nicht auf der Sequenz, in der sie definiert sind. Zum Beispiel:
Funktion Job1 ()Konsole.log ("Ich bin Aufgabe 1");
Funktion Job3 ()
Konsole.log ("Ich bin Aufgabe 3");
Funktion Job2 ()
Konsole.log ("Ich bin Aufgabe 2");
Job1 ();
Job2 ();
Job3 ();
Sie erhalten die folgende Ausgabe:
Aber was ist, wenn wir Aufgabe 2 nur aufrufen möchten, wenn Aufgabe 1 seine Verarbeitung beendet. Dafür benötigen wir Rückruffunktionen und ein grundlegendes Verständnis der asynchronen Ausführung.
Ein Beispiel für einen Rückruf in Aktion
Betrachten Sie den folgenden Code:
var members = ["John Doe", "Sam Smith", "Allie Cartel"];Funktion addnewMember (Newuser)
Mitglieder.Push (Newuser);
Funktion getAllMembers ()
Konsole.Protokoll (Mitglieder);
addnewMember ("alpha");
GetAllMembers ();
Wir arbeiten mit einem Array zusammen, das die Liste der Mitglieder eines sozialen Clubs enthält, und wir haben zwei Funktionen. Eine Funktion, die die Liste aller Mitglieder ausdruckt, und mit der anderen wird ein Mitglied zur Liste hinzugefügt.
Ändern wir diesen Code, damit er das Verhalten realer Datenbanken und Netzwerkverzögerungen wie Verzögerungen und Pings nachahmt.
var members = ["John Doe", "Sam Smith", "Allie Cartel"];Funktion addnewMember (Newuser)
setTimeout (function ()
Mitglieder.Push (Newuser);
Konsole.log ("Mitglied hinzugefügt");
, 200);
Funktion getAllMembers ()
setTimeout (function ()
Konsole.log ("Mitglieder sind:");
Konsole.Protokoll (Mitglieder);
, 100);
addnewMember ("alpha");
GetAllMembers ();
Wie Sie sehen können, verwendet dieser Code den setTimeout () Funktionen zur Nachahmung der Verzögerungen von Datenbanken. Der Zusatz dauert ungefähr 2 Sekunden und GetAllmembers () Die Funktion dauert 1 Sekunde.
Wir möchten einen neuen Benutzer „Alpha“ hinzufügen und die Liste drucken, nachdem das Mitglied hinzugefügt wurde, nicht zuvor, und deshalb verwenden wir die Sequenz:
addnewMember ("alpha");GetAllMembers ();
Führen Sie den Code aus und Sie erhalten die folgende Ausgabe:
Die Liste wurde zuerst gedruckt, und dann wurde das Mitglied hinzugefügt. Dies liegt daran, dass das Programm nicht auf die wartete Mitglied hinzufügen() Funktion zur Beendigung der Verarbeitung. Wenn wir nun Callback -Funktionen verwenden, um die auszuführen GetAllmembers () funktionieren erst nach dem addnewMember () ist fertig, unser Code wird:
var members = ["John Doe", "Sam Smith", "Allie Cartel"];Funktion addnewMember (Newuser, Callback)
setTimeout (function ()
Mitglieder.Push (Newuser);
Konsole.log ("Mitglied hinzugefügt");
Ruf zurück();
, 200);
Funktion getAllMembers ()
setTimeout (function ()
Konsole.log ("Mitglieder sind:");
Konsole.Protokoll (Mitglieder);
, 100);
addnewMember ("Alpha", getallMembers);
Wenn Sie sich den Code ansehen, sehen Sie das in der addnewMember () Funktion Wir nehmen ein Rückrufargument. Dies wird sicherstellen, dass die Rückruffunktion in unserer gewünschten Sequenz ausgeführt wird.
Die Ausgabe des obigen Codesausschnitts beträgt:
Das neue Mitglied wurde zuerst hinzugefügt und dann wurde die gesamte Liste auf die Konsole gedruckt. Auf diese Weise können Sie Rückrufe verwenden, um die Kontrolle über die Abfolge der Ausführung zu erlangen.
Was sind Versprechen?
Ein Versprechen ist ein Objekt und ist etwas, das in Zukunft gemacht/abgeschlossen wird. In JavaScript ist es genau das gleiche wie im wirklichen Leben. Der Syntax eines Versprechens in JavaScript ist unten angegeben:
var Mypromise = New Promise (Funktion (Auflösung, Ablehnung)// ein Code
);
Wie aus der Versprechensyntax ersichtlich ist, akzeptiert der Versprechenkonstruktor nur die Rückruffunktion als Argument. Die Parameter von Resolve und Ablehnung werden in der Rückruffunktion verwendet, wobei die Resolve aufgerufen wird, wenn die in der Rückruffunktion durchgeführten Aktivitäten erfolgreich sind. Wenn das Verfahren jedoch nicht erfolgreich ist, wird die Ablehnung genannt.
Nehmen wir zum Beispiel an, Ihre Mutter verspricht Ihnen, Ihnen an Ihrem Geburtstag ein Fahrrad zu bekommen. Dieses Versprechen ist ihre Garantie, dass sie Ihnen an Ihrem Geburtstag ein Fahrrad kaufen wird, aber wenn es soweit ist, kann sie ihre Meinung ändern. So kann sie dir ein Fahrrad kaufen oder nicht. Dies ist ein Versprechen in der einfachen Laiensprache. Wenn wir uns dieses Beispiel ansehen, können wir drei Zustände/ Möglichkeiten eines Versprechens in JavaScript identifizieren:
- Erfüllt: Fahrrad wird gekauft. Ergebniswert
- Ausstehend: Ihr Geburtstag ist nicht gekommen und Sie sind sich nicht sicher, ob Ihre Mutter Ihnen ein Fahrrad kaufen wird oder nicht. Nicht definiert
- Abgelehnt: Fahrräder werden an Ihrem Geburtstag nicht für Sie gekauft. Fehler.
Um Versprechen besser zu verstehen lassen, lassen Sie uns eine durchgehen Beispiel:
Wir werden dieses Beispiel Schritt für Schritt i-e zuerst nutzen. Wir werden ein Versprechensobjekt mit dem Versprechen-Konstruktor erstellen, wie in der oben genannten Syntax des Versprechens zu sehen ist. Als nächstes werden wir dieses Versprechensobjekt verwenden.
Im folgenden Code werden wir erstellen ein Versprechensobjekt:
// Erstellen von Versprechensobjektenvar Mypromise = New Promise (Funktion (Auflösung, Ablehnung)
const nummer1 = 2;
const nummer2 = 2;
// zwei Zahlen vergleichen
if (number1 === number2)
// Operation erfolgreich
beschließen();
anders
// Ein Fehler ist aufgetreten
ablehnen();
);
Im obigen Code haben wir zunächst ein Versprechensobjekt erstellt mein Versprechen, und übergab dann eine Rückruffunktion im Versprechenkonstruktor. In der Funktion überprüfen wir, ob zwei Zahlen gleich sind oder nicht. Wenn die Nummern gleich sind, wird der Anruf aufgelöst, sonst wird der Anruf abgelehnt, wenn ein Fehler eintritt.
Um das Versprechensobjekt zu verwenden (mein Versprechen) wir brauchen "Versprechen Sie Verbraucher”(Versprechen durch Registrieren von Funktionen) bekannt als Dann() Erfüllungsmethode und fangen() Methode zur Ablehnung. Der folgende Code zeigt dies:
mein Versprechen.dann (function ()
Konsole.log ("Zahlen gleich. Erfolg");
).
catch (function ()
Konsole.log ('Fehler');
);
Wenn die überprüften Zahlen gleich sind, dann die .Dann() Methode wird aufgerufen und wir werden sehen "Zahlen gleich. Erfolg”. Wenn die Zahlen jedoch nicht gleich sind, dann die .fangen() Methode wird aufgerufen und wir werden die sehen Fehler Nachricht im Konsolenfenster.
Der gesamte Code ist unten angegeben:
// Erstellen von Versprechensobjektenvar Mypromise = New Promise (Funktion (Auflösung, Ablehnung)
const nummer1 = 2;
const nummer2 = 2;
// zwei Zahlen vergleichen
if (number1 === number2)
// Operation erfolgreich
beschließen();
anders
// Ein Fehler ist aufgetreten
ablehnen();
);
// Verheißungsobjekt verwenden
mein Versprechen.
dann (function ()
Konsole.log ("Zahlen gleich. Erfolg");
).
catch (function ()
Konsole.log ('Fehler');
);
Aus der Ausgabe können wir sehen, dass die Zahlen gleich sind.
Abschluss
Um einen asynchronen Code in JavaScript zu implementieren, verwenden wir Rückruffunktionen und Versprechen. Eine Rückruffunktion wird als Argument an eine andere Funktion übergeben, während Versprechen etwas ist, das in Zukunft erreicht oder abgeschlossen wird. In JavaScript ist ein Versprechen ein Objekt, und wir verwenden den Promise -Konstruktor, um ein Versprechen zu initialisieren. Um versprechende Objekte zu verwenden, nehmen wir Hilfe von Versprechen, die Verbraucher sind, die es sind Dann() Methode (wenn Versprechen erfüllt) und fangen() Methode (wenn Versprechen abgelehnt wird).