Implémentation de l'utilisation des objets Promise en JavaScript

JavaScript est un langage de programmation asynchrone. Lors du traitement d'opérations asynchrones, l'utilisation de fonctions de rappel est une méthode traditionnelle. Cependant, un trop grand nombre de niveaux d'imbrication des fonctions de rappel entraînera une mauvaise lisibilité du code et des coûts de maintenance élevés. Afin de résoudre ces problèmes, ES6 a introduit l'objet Promise, qui permet de mieux gérer les opérations asynchrones.

L'objet Promise est un objet qui représente l'achèvement final (succès) ou l'échec (échec) d'une opération asynchrone. Cela fait ressembler le code asynchrone à du code synchrone et évite les couches d’arrière-plan imbriquées. En JavaScript, l'utilisation des objets Promise est divisée en trois étapes :

1. Créer des objets Promise
2. Une fois l'opération asynchrone terminée, deux situations sont traitées respectivement ( succès et échec)
3. Obtenir les résultats du fonctionnement asynchrone

Ci-dessous, nous examinerons la mise en œuvre de chaque étape une par une.

1. Créer un objet Promise

Nous pouvons utiliser le nouveau mot-clé pour créer un objet Promise et transmettre une fonction d'exécuteur. La fonction exécuteur a deux paramètres, résoudre et rejeter. La résolution est utilisée pour gérer le succès de l'opération asynchrone et le rejet est utilisé pour gérer l'échec de l'opération asynchrone.

Par exemple, créez un objet Promise pour simuler une opération asynchrone :

const promise = new Promise((resolve, reject) => {
  // 异步操作
  setTimeout(() => {
    const result = Math.random();
    if (result >= 0.5) {
      resolve(result);
    } else {
      reject('操作失败');
    }
  }, 1000);
});

Dans l'exemple ci-dessus, une opération asynchrone est simulée via setTimeout. Si le nombre généré aléatoirement est supérieur ou égal à 0,5, l'opération asynchrone réussit ; sinon, elle échoue et un message d'erreur est généré.

2. Une fois l'opération asynchrone terminée, deux situations (succès et échec) sont traitées respectivement

D'une manière générale, une fois l'opération asynchrone terminée , Nous devons traiter les résultats de l'exécution. En utilisant les objets Promise, nous pouvons gérer respectivement le succès et l’échec en appelant les méthodes then() et catch().

En cas de succès, nous devons passer une fonction de rappel en paramètre de la méthode then(). La fonction de rappel reçoit le résultat de l'opération asynchrone réussie en tant que paramètre.

En cas d'échec, nous devons passer une fonction de rappel en paramètre de la méthode catch(). La fonction de rappel reçoit la raison de l'échec de l'opération asynchrone en paramètre.

Continuez l'exemple ci-dessus et gérez le succès et l'échec des opérations asynchrones :

promise.then((result) => {
  console.log(`操作成功，结果为：${result}`);
}).catch((reason) => {
  console.log(`操作失败，原因为：${reason}`);
});

Dans l'exemple ci-dessus, lorsque l'opération asynchrone réussit, dans la méthode then() Le la fonction de rappel sera exécutée. Au contraire, lorsque l'opération asynchrone échoue, la fonction de rappel de la méthode catch() sera exécutée. De cette façon, nous pouvons facilement effectuer un traitement ultérieur basé sur les résultats des opérations asynchrones.

3. Obtenir les résultats des opérations asynchrones

Dans certains cas, nous devons obtenir les résultats des opérations asynchrones, comme entre deux opérations asynchrones Quand il y a des dépendances. À l'heure actuelle, vous pouvez utiliser la méthode statique Promise.all() fournie par l'objet Promise, qui peut fusionner plusieurs objets Promise en un nouvel objet Promise et renvoyer tous les résultats des opérations une fois toutes les opérations terminées.

Par exemple, dans le code suivant, nous créons deux objets Promise, simulons respectivement deux opérations asynchrones et générons les résultats une fois qu'elles sont toutes deux terminées :

const promise1 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('操作1完成');
  }, 1000);
});

const promise2 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('操作2完成');
  }, 2000);
});

Promise.all([promise1, promise2]).then((results) => {
  console.log(results);
}).catch((reason) => {
  console.log(`操作失败，原因为：${reason}`);
});

Ci-dessus Dans l'exemple , notez que la méthode Promise.all() reçoit un tableau contenant des objets Promise en paramètre. Lorsque tous les objets Promise sont terminés, la fonction de rappel de la méthode then() exécutera et affichera les résultats des deux opérations asynchrones.

En bref, l'utilisation d'objets Promise peut mieux effectuer une programmation asynchrone. Cela peut simplifier le code pour les opérations asynchrones et améliorer la lisibilité et la maintenabilité du code. Ce qui précède est le processus détaillé d'utilisation des objets Promise en JavaScript. J'espère que cela sera utile aux lecteurs.

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!