Maison > interface Web > js tutoriel > le corps du texte

Compréhension approfondie des techniques js promise chain_javascript

WBOY
Libérer: 2016-05-16 15:02:04
original
1424 Les gens l'ont consulté

La nouvelle norme ajoute la promesse native.

Ici, nous discutons uniquement de l'utilisation des chaînes et réfléchissons aux détails.

1. Révision de then() et catch()

La fonction de rappel peut être placée dans les paramètres de then() et catch() pour recevoir le résultat final d'une Promesse.

then() peut recevoir un paramètre, alors ce rappel ne sera appelé que lorsque Promise solve().

then() peut également recevoir un deuxième paramètre, puis le deuxième rappel est utilisé pour gérer la situation de rejet de promesse().

catch() gère spécifiquement les situations de rejet de promesse().

En d'autres termes, then() peut être utilisé dans les deux sens, et catch() ne peut gérer que les situations de rejet(). Cependant, il est recommandé d'utiliser then() pour gérer solve() et catch() pour gérer rejet().

Deuxièmement, cependant, ce dont je veux parler n'est pas ce qui précède. Ce qui précède vise simplement à revoir l'utilisation de base. Ici, nous commençons à parler des valeurs de retour de then() et catch() et des détails de l'utilisation de la chaîne.

Ensuite, la documentation officielle dit que then() et catch() renvoient une promesse, ce qui est très intrigant. (Je suis nouveau sur js et je n'ai jamais été exposé à des promesses dans la nature auparavant).

Tout d’abord, cette promesse nouvellement renvoyée n’est pas la promesse originale

;

Deuxièmement, le changement de statut de cette promesse nouvellement renvoyée (qu'il s'agisse de solve() ou de rejet().) est lié au statut de la promesse précédente et à la manière dont then() est utilisé.

Expliquez d'abord la situation de then() : (similaire à catch)

var p1 = Promise.resolve("Success");
var p2 = p1.then(task1);
var p3 = p2.then(task2);
Copier après la connexion

Remarque : les tâches 1 et 2 ci-dessus sont toutes deux des rappels.

Ici, p1 est une promesse créée et résolue() directement

p2 est une promesse obtenue en utilisant then(), et p3 est également une promesse obtenue en utilisant then().

Alors, comment le statut du p2 change-t-il ?

Je vais utiliser l'image suivante pour expliquer ce concept :

Parmi eux,

1. L'octogone représente un objet Promise.

2. Le cercle représente l'état interne d'une promesse, et la flèche noire représente les changements d'état.

3. La flèche droite représente l'appel de la fonction then.

4. En d'autres termes, tant que la fonction then est appelée, un nouvel objet Promise sera généré.

5. Lors de l'appel de la fonction then, je ne sais pas quel est le statut de l'objet Promise précédent, est-il en attente ou réglé ? Cela ne peut être supposé et ne peut être vu du monde extérieur.

6. L'appel de la fonction then ne bloquera pas, c'est-à-dire que p2 et p3 sont générés presque instantanément, même si p1 migre encore lentement vers son propre état.

On sait que le statut de p1 est résolu (voir le code ci-dessus). Cependant, il n'a pas été expliqué ici comment le statut de p2 et p3 change. Est-il résolu ou rejeté ? Découvrez la nouvelle image ci-dessous.

Vous pouvez voir plus de formes de diamant.

Le losange représente la fonction de rappel transmise lors de l'appel. Le losange vers le haut représente le traitement entrant [pour l'objet Promise précédent qui a été résolu], et le losange vers le bas représente le traitement entrant [pour l'objet Promise précédent qui a été rejeté].

Remarque : dans cet exemple, le traitement de rejet n'est pas transmis. C'est-à-dire que le losange descendant ne doit pas être dessiné dans l'image ci-dessus. Il est dessiné ici pour plus de commodité. Nous avons seulement besoin de savoir que le losange vers le haut et vers le bas. le losange nous est spécifique. Comment utiliser then ou catch. Jetez un autre œil à l’exemple de code :

<span>var</span> p1 = Promise.resolve("Success"<span>);</span><span>var</span> p2 =<span> p1.then(task1);//产生了向上的菱形</span><span>var</span> p3 = p2.then(task2);//产生了向上的菱形
Copier après la connexion

Wie Sie sehen, haben wir den zweiten Parameter damals nicht bereitgestellt, was bedeutet, dass wir die Ablehnungssituation nicht behandelt haben.

Außerdem können Sie „dann“ verwenden, wenn Sie mit „Reject“ umgehen möchten, oder Sie können „Catch“ verwenden, das speziell für die Verarbeitung von „Reject“ verwendet wird.

1. Wenn der Endstatus von p1 (auflösen oder ablehnen) korrekt verarbeitet wird (wenn dann aufgerufen wird, wird der entsprechende Rückruf übergeben, d. h. es gibt eine entsprechende Raute), dann ändert sich der Status von p2 in „auflösen“. .

2. Wenn der Endstatus von p1 (Auflösen oder Ablehnen) nicht korrekt verarbeitet wird (wenn dann aufgerufen wird, fehlt der entsprechende Rückruf, dh es gibt keine entsprechende Raute), wird an den Status von p1 weitergeleitet p2 (erhält p1-Status).

3. Gib es so weiter.

4. In diesem Artikel wird nicht erklärt, wie man die endgültigen Daten des vorherigen Versprechens im Rückruf erhält, d. h. wie man die Daten überträgt. Dazu gibt es viele Tutorials.

Dritten: Im Folgenden werden einige Beispiele aufgeführt, um diesen Artikel zusammenzufassen.

Der Status von P1 im Bild ist angegeben, Lösung oder Ablehnung werden alle von Ihnen selbst angegeben. Ziel ist es, die Endzustände von P2 und P3 abzuleiten.

Die oben genannten sind vier unabhängige Beispiele ohne Zusammenhang zwischen ihnen.

X bedeutet, dass P3 die Funktion „Dann“ oder „Fang“ nicht verwendet, sodass es keine Möglichkeit gibt, mit „Auflösen“ oder „Ablehnen“ umzugehen.

Wenn es Fehler gibt, korrigieren Sie diese bitte rechtzeitig. Vielen Dank! ~! ! @~~~

Das obige detaillierte Verständnis der js-Versprechenskette ist der gesamte vom Herausgeber geteilte Inhalt. Ich hoffe, dass er Ihnen eine Referenz geben kann, und ich hoffe, dass Sie Script Home unterstützen.

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal