Maison  >  Article  >  interface Web  >  Promesse en Javascript

Promesse en Javascript

Barbara Streisand
Barbara Streisandoriginal
2024-10-20 14:34:02417parcourir

Promesse

représente une valeur qui peut être disponible maintenant, ou dans le futur, ou jamais.
Cycle de vie de la promesse :

  • En attente : la fonction commence à fonctionner.

  • Réalisé : l'opération s'est terminée avec succès et nous avons une valeur de résultat.

  • Rejeté : l'opération a échoué et nous avons un objet d'erreur.

Syntaxe d'une promesse :

Une promesse est créée à l'aide du nouveau constructeur Promise, qui prend une fonction avec deux arguments : résoudre et rejeter.

Promise in Javascript
Dans l'extrait de code, nous avons une fonction appelée getUser, qui renvoie une nouvelle Promise (un objet de promesse qui possède des méthodes pour gérer les opérations asynchrones).

À l'intérieur du constructeur Promise, nous avons une fonction setTimeout qui simule une opération asynchrone, telle que la récupération de données à partir d'une base de données. La promesse est transmise par deux méthodes clés :

  • resolve : Ceci est appelé lorsque l'opération réussit. Dans ce cas, si id === 1, il renvoie un objet utilisateur fictif { id : 1, nom : "Diana", email : "Diana@test.com" }.

  • reject : Ceci est appelé lorsque l'opération échoue. Si l'identifiant n'est pas 1, la promesse est rejetée avec un message d'erreur "Utilisateur introuvable...".

Les fonctions de résolution et de rejet agissent comme des instructions return dans le contexte de promesses, permettant à l'appelant de gérer le succès ou l'échec de l'opération.

Enchaîner les promesses

Les promesses peuvent être chaînées, vous permettant d'effectuer une série d'opérations asynchrones en séquence :

Promise in Javascript

Dans cet exemple, nous enchaînons plusieurs promesses pour simuler la récupération des données étape par étape.

  • Tout d'abord, nous appelons getUser(1) pour obtenir les données utilisateur. Si cela fonctionne, nous passons à l'étape suivante.

  • Deuxièmement, nous prenons le user.id et l'utilisons pour obtenir les commandes de cet utilisateur en appelant getOrders(user.id).

-Troisièmement, nous sélectionnons la deuxième commande (commandes[1]) dans la liste et obtenons ses détails en utilisant getOrderDetails(orders[1]).

Si quelque chose ne va pas à un moment donné (par exemple si l'utilisateur est introuvable ou si des commandes sont manquantes), l'erreur sera détectée dans le bloc .catch() et affichée.

Répartition simple :

  • Vous demandez un utilisateur.
  • Si vous trouvez l'utilisateur, vous demandez ses commandes.
  • Si vous recevez les commandes, vous demandez des détails sur l'une des commandes.
  • Si quelque chose ne va pas (comme si l'utilisateur ou les commandes ne sont pas trouvées), une erreur s'affichera.

résultat :

Promise in Javascript

Cette approche facilite le travail avec des tâches asynchrones de manière propre, étape par étape, au lieu d'avoir un code compliqué.

Méthodes de promesse :

Promise.all() : exécute plusieurs promesses en parallèle et attend qu'elles soient toutes résolues.

Promise.all([promise1, promise2])
  .then((results) => {
    console.log(results);  // Array of all fulfilled values
  });

Exemple :

Promise in Javascript

(Je recommande de lire et de comparer cette approche des rappels)

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!

Déclaration:
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