Promise ist eine neue Lösung für die asynchrone Programmierung, die von ES6 eingeführt wurde. Die Syntax von Promise ist - ein Konstruktor,
Grundlegende Verwendung von PromiseInstanziieren eines Promises neues Versprechen() Beim Instanziieren wird ein Parameter akzeptiert, nämlich eine Funktion. Diese Funktion hat zwei Parameter: „Auflösen“ und „Ablehnen“. var Versprechen = neues Versprechen ((lösen, ablehnen) => { // Es wird verwendet, um asynchrone Operationen zu handhaben}) Wir verwenden hier Timer, um asynchrone Operationen zu simulieren Promise hat drei Zustände: in Bearbeitung, erfolgreich und fehlgeschlagen. var Versprechen = neues Versprechen ((lösen, ablehnen) => { // Dies ist eine asynchrone Operation setTimeout(() => { // Hier wird das Erhalten der Daten simuliert var data = 'erhaltene Daten' // Nachdem wir die Daten erhalten haben, können wir die Methoden „Resolve“ und „Reject“ aufrufen, um den Status des Promise-Objekts zu ändern. „Resolve“ (Daten) // „Resolve“ kann den Status des Promise-Objekts auf „Erfolgreich“ ändern, „Reject()“ kann den Status des Promise-Objekts auf „Fehler“ ändern. }, 1000); }) Die then-Methode von PromiseWenn der Status des Promise-Objekts Erfolg oder Misserfolg ist, können Sie die then-Methode aufrufen Die then-Methode akzeptiert zwei Parameter und beide Parameter sind Werte vom Funktionstyp Wenn das Promise-Objekt erfolgreich ist, wird der erste Parameter der then-Methode aufgerufen Das heißt, wenn der Status des Promise-Objekts fehlgeschlagen ist, wird der zweite Parameter der then-Methode aufgerufen Der zweite Parameter ist optional und kann weggelassen werden, wenn Sie keine Fehler erfassen müssen. Die Parameter haben einen formalen Parameter, die erfolgreiche Funktion heißt „value“ und die fehlgeschlagene Funktion heißt „err“. versprechen.dann(Wert => { // Wenn resolve(data) in der asynchronen Funktion aufgerufen wird, das heißt, wenn der Status des Promise-Objekts erfolgreich ist, wird der erste Parameter der then-Methode console.log(value) aufgerufen; // Der Wert „Hallo Welt“ sind die von der Methode resolve() übergebenen Daten}, err => { // Wenn reject(data) in der asynchronen Funktion aufgerufen wird, d. h. wenn der Status des Promise-Objekts fehlgeschlagen ist, wird der zweite Parameter der then-Methode console.log(err) aufgerufen; // err sind die von der reject()-Methode übergebenen Daten}) Das Rückgabeergebnis des Aufrufs der then-Methode ist ein Promise-Objekt, und der Status des Objekts wird durch das Ausführungsergebnis der Rückruffunktion bestimmt. Wenn das in der Rückruffunktion zurückgegebene Ergebnis eine Eigenschaft ist, die nicht dem Typ „Promise“ entspricht, lautet der Status „Erfolgreich“ und der Rückgabewert ist der Erfolgswert des Objekts. lass Daten = Versprechen.dann((Wert) => { // konsole.log(Wert.Ergebnis); // Nicht-Promise zurückgeben // val.result zurückgeben // Versprechen zurückgeben return new Promise( (auflösen, ablehnen) => { // auflösen('ok') ablehnen('fehler') }) }, err => { console.log(fehler); }) // Gibt ein Nicht-Promise zurück und der Status ist Erfolg. Der Rückgabewert ist der Erfolgswert des Objekts. // Das Rückgabeergebnis ist ein Promise-Objekt. Der Objektstatus wird durch das Ausführungsergebnis der Rückruffunktion bestimmt. // Löst einen Fehler aus und der Status ist Fehlschlag. console.log(data); Dann kann es in einer Kette aufgerufen werden. Informationen zur Verwendung finden Sie im folgenden Anwendungsbeispiel für Promise. Promise-Catch-MethodeDie Catch-Methode von Promise ist ein Alias von then(null, rejection) und wird verwendet, um einen Rückruf anzugeben, wenn ein Fehler auftritt. Wenn der Status des Promise-Objekts aufgelöst ist, wird die angegebene Rückruffunktion der then-Methode aufgerufen const promise = neues Versprechen((lösen, ablehnen) => { lösen('ok') }) versprechen.dann(val => { console.log(Wert); // ok }).catch(err => { console.log(fehler); }) Wenn der Status des Versprechens abgelehnt wird, wird die Rückruffunktion der Catch-Methode aufgerufen, um dieses Problem zu beheben. const promise = neues Versprechen((lösen, ablehnen) => { ablehnen('fehler') }) versprechen.dann(val => { konsole.log(Wert); }).catch(err => { console.log(err); // Fehler }) Wenn während der Ausführung der then-Methode ein Fehler auftritt, wird dieser ebenfalls von der catch-Methode erfasst. const promise = neues Versprechen((lösen, ablehnen) => { lösen('Fehler') }) versprechen.dann(val => { console.log('ok'); // ok werfen Sie „Etwas ist schiefgelaufen!“ ! ' // Dann auftretende Fehler werden weiterhin von catch abgefangen}).catch(err => { console.log(err); // Etwas ist schiefgelaufen! ! }) Der Fehler eines Promise-Objekts ist ein sprudelnder Charakter und wird zurückgegeben, bis er abgefangen wird. Das heißt, der Fehler wird immer durch den nächsten Catch abgefangen. const promise = neues Versprechen((lösen, ablehnen) => { lösen('ok') }) versprechen.dann(val => { returniere neues Promise((lösen, ablehnen) => { ablehnen('fehler') }) }) .then(val => { returniere neues Promise((lösen, ablehnen) => { ablehnen('fehler') }) }) .catch(err => { // Alle oben generierten Fehler können mit „catch console.log(err);“ abgefangen werden. // err }) Definieren Sie im Allgemeinen nicht die Callback-Funktion für den abgelehnten Status (also den zweiten Parameter von then), sondern verwenden Sie immer die Catch-Methode. Promise AppVersprechen, Dateien zu lesen, mehrere Dateien werden kontinuierlich aufgerufen In diesem Beispiel verwenden wir das Node.js-Dateimodul // Dateiinformationen lesen const fs = require('fs') Im folgenden Code verwenden wir promise, um die asynchrone Funktion zu umschließen Schauen wir uns zunächst den normalen Dateilesevorgang an // Dateiinformationen lesen const fs = require('fs') // Wenn das Lesen fehlschlägt, ist „err“ ein Fehlerobjekt, und wenn das Lesen erfolgreich ist, sind „data“ die Daten fs.readFile('./01.txt', (err, data) => { // Bestimmen Sie, ob ein Fehler auftritt. Wenn ein Fehler auftritt, drucken Sie das Fehlerobjekt. wenn (Fehler) { console.log(fehler); zurückkehren } Konsole.log(Daten.toString()); }) Wenn wir die Datei nach dem erfolgreichen Lesen weiter lesen möchten, müssen wir in der Rückruffunktion weiterhin fs.readFile ... verwenden, um die Datei zu lesen. Wenn die Verschachtelungsebene zu hoch ist, wird eine Rückrufhölle gebildet. Als nächstes verwenden wir die Promise-Methode, um die Datei zu lesen // Dateiinformationen lesen const fs = require('fs') const promise = neues Versprechen((lösen, ablehnen) => { fs.readFile('./01.txt', (err, data) => { wenn (Fehler) returniere ablehnen(Fehler) auflösen (Daten) }) }) versprechen.dann(val => { console.log(val.toString()); //Gibt ein Promise-Objekt zurück return new Promise((resolve, reject) => { fs.readFile('./02.txt', (err, data) => { wenn (Fehler) returniere ablehnen(Fehler) auflösen (Daten) }) }) }, err => { console.log(fehler); }) // Das vorherige gibt dann ein Promise-Objekt zurück, wir können fortfahren. .then(val => { console.log(val.toString()); returniere neues Promise((lösen, ablehnen) => { fs.readFile('./03.txt', (err, data) => { wenn (Fehler) returniere ablehnen(Fehler) auflösen (Daten) }) }) }, err => { console.log(fehler); }) .then(val => { console.log(val.toString()); }, err => { console.log(fehler); }) Versprechen kapselt Ajax-Anfrage Kapselt die Ajax-Anfrage und verwendet sie dann, um das Ergebnis abzurufen. Dadurch sieht der Code prägnanter aus und das Problem der Callback-Hölle wird gelöst. const promise = neues Versprechen((lösen, ablehnen) => { // Objekt erstellen const xhr = new XMLHttpRequest() // Initialisieren Sie xhr.open("GET", 'https://api.apiopen.top/getSongPoetry?page=1&count=20') // Senden Sie xhr.send() // Bind-Ereignisverarbeitungsantwortergebnis xhr.onreadystatechange = function () { // Beurteilung // Beim Eintritt in die letzte Phase werden alle Antworttexte zurückgegeben, wenn (xhr.readyState === 4) { // Bestimmen Sie den Antwortcode, wenn (xhr.status >= 200 && xhr.status < 300) { // Zeigt Erfolg an // console.log(JSON.parse(xhr.response)); auflösen(JSON.parse(xhr.response)) } anders { ablehnen(xhr.status) } } } }) // Rückrufversprechen angeben.then((val) => { konsole.log(Wert); }, err => { console.log(fehler); }) Dies ist das Ende dieses Artikels über die Einführung und grundlegende Verwendung von Promise. Weitere relevante Inhalte zur Verwendung von Promise finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird! Das könnte Sie auch interessieren:
|
<<: Reine CSS-Implementierung eines Radio- und Checkbox-Effektbeispiels
>>: Zusammenfassung gängiger Docker-Befehle
Inhaltsverzeichnis Vorwort Stellt der Interviewer...
Einführung Weil JavaScript standardmäßig ein Thre...
Dies ist mein erster Blog. Ich bin seit zwei Jahr...
Nachdem die Quelle des Iframes auf „about:blank“ g...
Nach einem abnormalen Herunterfahren von VMware w...
Alles braucht ein Fundament. Um ein Haus zu bauen...
Fügen Sie das Tag <Head> hinzu <meta http...
Inhaltsverzeichnis Abfragehintergrund 1. Like-Abf...
Inhaltsverzeichnis Methode 1: Set: Es handelt sic...
In diesem Projekt wird der Docker-Container zum E...
Inhaltsverzeichnis 1. Einführung in das Verbindun...
Was ist ein Selektor? Die Rolle des Selektors bes...
1. Einleitung Git ist ein kostenloses, verteiltes...
1. Installieren Sie ffmpeg unter Centos Linux 1. ...
Vorwort Jeder weiß, dass viele Websites mittlerwe...