Apprenez les promesses javascript. Partie Qu'est-ce qu'une promesse ?

Apprenez les promesses javascript. Partie 1 — Qu'est-ce qu'une promesse ?

Hé, fans de javascript, aujourd'hui, je vais vous parler des promesses et comment vous pouvez les apprendre ou mieux les comprendre. Beaucoup de gens pensent qu’il s’agit d’un sujet compliqué et s’y perdent, même si cela n’a rien de compliqué, et si vous le pratiquez souvent, vous deviendrez un expert, je vous le garantis. Ma tâche aujourd'hui est de vous aider à comprendre les bases, de démontrer l'essence des promesses et pourquoi nous en avons besoin.

Qu'est-ce qu'une promesse et pourquoi en avez-vous besoin en javascript ?

Imaginez que vous avez promis à vos amis que vous ferez continuellement de l'exercice chaque matin et que vous les informerez si vous le faites. Votre promesse ne vous empêche pas, vous ou vos amis, de vivre leur vie et ils attendent simplement votre notification concernant le succès ou l'échec de l'engagement pour tirer des conclusions ou des actions à votre sujet.

Ce petit exemple illustre la nature de la promesse en tant qu'événement et les deux acteurs qui sont liés par cet événement : dans ce cas, il s'agit du consommateur (vos amis), et du producteur (vous) :

Et si on simplifie un peu, on peut dire qu'en javascript on voit le même comportement avec la classe Promise, ce qui nous donne la possibilité d'effectuer des tâches asynchrones sans bloquer le thread principal du javascript et notifier les abonnés quand on a fini notre promesse.

Prenons un exemple pour comprendre comment travailler avec :

Revoyons ce code dans l'ordre :

1. Nous créons une instance de promesse avec une fonction d'exécution (c'est une fonction que nous transmettons au constructeur de la classe Promise).

La fonction exécuteur est la base de la promesse, et cette fonction est appelée instantanément lorsque la promesse est créée.

La fonction exécuteur prend deux paramètres de position, le premier est la méthode de résolution et le second est la méthode de rejet. Ces deux méthodes sont responsables de la fin de la promesse dans un certain temps.

Par exemple, nous avons promis de nous lever tous les matins et de faire de l'exercice pendant une semaine. Dans ce cas, notre promesse dure une semaine entière, et si vous ne pouvez pas la tenir le jour 3, vous pouvez appeler la méthode de rejet et tous ceux qui sont abonnés à votre promesse le sauront. Ou vice versa, si vous tenez votre promesse, le jour 7, vous appellerez la méthode de résolution, qui informera vos amis que vous avez tenu votre promesse avec succès. Vous pouvez donc voir que les consommateurs (vos amis) sont complètement indépendants du moment où vous leur communiquez les résultats, ils ont juste besoin d'être sûrs que lorsqu'ils le seront, ils pourront les obtenir.

L'image ci-dessous montre les états de promesse possibles, ils sont « en attente », « réalisés » et « rejetés ». Lorsqu'une promesse vient d'être initiée, son statut est « en attente ». Une fois terminé, il est soit « exécuté », soit « rejeté », selon la méthode qui a été appelée pour le terminer.

Il convient également de noter qu'un exécuteur de promesse ne peut pas être complété plus d'une fois, tous les appels ultérieurs aux méthodes de résolution ou de rejet seront ignorés.

1. Au moment où vous dites que vous avez terminé votre promesse (en appelant la méthode de résolution ou de rejet), tous ceux qui ont souscrit à la promesse recevront une notification avec la charge utile, qui peut être récupérée dans deux méthodes spéciales de l'instance de promesse. . Ces méthodes sont : Promise.prototype.then et Promise.prototype.catch

En utilisant la méthode Promise.prototype.then, vous pouvez gérer à la fois des scénarios positifs et négatifs, car la fonction accepte deux rappels comme dans la capture d'écran ci-dessus.

Avec Promise.prototype.catch, vous ne pouvez gérer que des scénarios négatifs comme celui-ci :

et laissez le Promise.prototype.then pour des scénarios positifs.

De plus, les promesses fournissent une méthode que vous pouvez utiliser pour exécuter du code qui doit être exécuté quel que soit le résultat. Cette méthode est Promise.prototype.finally :

Cette méthode ne prend rien et ne renvoie rien, car elle est conçue pour terminer ou nettoyer les opérations précédentes. Par exemple, pour afficher le message à l'utilisateur ou pour masquer le chargeur.

Excellent, à ce stade, nous avons couvert les bases des promesses, je suggère donc de passer à un exemple concret, comme demander des données à l'API, les transformer d'une réponse HTTP brute en JSON et les afficher. à la console :

Comme vous pouvez le constater, le résultat de son utilisation dans le monde réel n'est pas très différent des compétences que nous avons mises en pratique au début de l'article. Mais vous avez peut-être remarqué quelques nouveautés :

• Le résultat de chaque gestionnaire Promise.prototype.then et Promise.prototype.catch précédent est transmis au gestionnaire Promise suivant. Il est bon de mentionner que la méthode Response.json renvoie une promesse qui, une fois exécutée, renverra un JSON et appellera le gestionnaire suivant en lui transmettant ce JSON.

• Dans le cas de Promise.prototype.finally, c'est un gestionnaire « invisible », et on peut dire qu'il transmet la réponse précédente à travers lui-même dans la suivante.

Génial, je suis sûr qu'à ce stade, vous comprenez mieux ce qu'est une promesse, comment l'utiliser et quels états elle peut avoir. De plus, je souhaite énumérer ci-dessous les points clés que nous avons abordés aujourd'hui (aide-mémoire) :

Résumé:

• Promesse Javascript — c'est un objet spécial qui vous permet d'exécuter des opérations asynchrones et d'en informer les consommateurs lorsque c'est fait

• L'instance de promesse peut avoir 3 états : "en attente", "réalisé" et "rejeté"

• Il existe trois méthodes principales de l'instance de promesse : « puis », « attraper » et « finalement ».

• Promise.prototype.then — conçu pour gérer à la fois les rejets et les résultats positifs

• Promise.prototype.catch — conçu pour gérer les résultats rejetés

• Promise.prototype.finally — conçu pour effectuer un certain nettoyage

• Vous pouvez enchaîner vos gestionnaires dans l'ordre de votre choix, ils seront exécutés séquentiellement

• Le résultat de la promesse précédente va dans la suivante, donc pour rendre la chaîne de promesses extensible, vous devez vous rappeler de renvoyer une promesse des gestionnaires à chaque fois, à l'exception du gestionnaire « finalement ».

Dans les prochaines parties de ce sujet, nous aborderons des techniques de promesse plus avancées et approfondirons ses capacités, alors abonnez-vous, aimez et restez à l'écoute !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!