Fermer

mars 15, 2019

Conversion de rappels en promesses


Voyons comment nous pouvons libérer le pouvoir associé à async / wait – en convertissant notre propre code hérité ou d'autres API de navigateur qui reposent toujours sur des rappels pour des fonctions prêtes à l'emploi.

J'adore async / wait en JavaScript moderne. Nous pouvons utiliser async / wait chaque fois qu'une fonction renvoie une promesse. Heureusement, de nombreuses bibliothèques prennent déjà en charge les promesses et de nombreuses API de navigateur telles que Fetch prennent également en charge les promesses. Toutes les API de navigateur ne se sont pas encore détournées des rappels, mais cela ne signifie pas que nous ne pouvons pas écrire nous-mêmes un peu de code pour les convertir en promesses, ce qui nous permet donc d'utiliser async / wait . Cela n'était pas possible auparavant.

Cet article traite de la conversion du code de rappel en promesses à l'aide de l'API de géolocalisation de l'événement onload de l'image et du navigateur . fonction requestIdleCallback .

J'espère que vous comprendrez mieux comment fonctionnent les promesses grâce à ces exemples. Tout le code trouvé dans cet article peut être trouvé ici .

Utiliser une promesse

Une promesse est un objet permettant de gérer un événement (futur) asynchrone permettant de soit fournir une réponse ou échouera avec une erreur. Pensez à l'API Fetch – elle vous fournira la réponse de votre demande AJAX ou échouera car elle ne pourra pas se connecter au serveur ni à aucune autre erreur 500. Dans les deux cas, on vous promet de recevoir le résultat positif ou le résultat négatif, d'où le nom Promise .

Nous accédons au résultat «positif» d'une promesse en appelant le . fonction. Un exemple utilisant Fetch, tiré de la documentation de Mozilla finit par ressembler à ceci ci-dessous. L'œil attentif verra deux appels à puis à ce qui signifie que nous avons en réalité tenu deux promesses différentes! Le premier, lorsque une réponse est reçue, et le second, lorsque la réponse a été convertie en JSON.

 fetch  ( "http://example.com/movies.json" ) 
  .  puis  ( fonction  ( réponse )   {
  réponse  réponse
 
 Le meilleur outil 2023 pour ta croissance Instagram ! 
 
 
   
 
Source link