Gestion des Opérations Asynchrones avec les Promesses
Qu'est-ce qu'une Promise ?
Une Promise est un espace réservé pour une valeur future, qui peut être :
Une promise commence avec l'état pending
et se termine définitivement soit en étant fulfilled
avec une valeur, soit en étant rejected
avec une raison.
Compréhension des méthodes resolve, reject et then()
Création d'une Promise
Pour créer une Promise, il faut passer une fonction avec deux paramètres : resolve
et reject
. Ces paramètres sont des fonctions utilisées pour indiquer si l'opération asynchrone a été réalisée avec succès ou a échoué.
const myPromise = new Promise((resolve, reject) => {
const success = true; // Simulate whether the task is successful
if (success) {
resolve('Task completed successfully!');
} else {
reject('Task failed.');
}
});
resolve(value)
: Marque la Promise comme accomplie (réussie) et transmet le résultat (value) ;reject(error)
: Marque la Promise comme rejetée (échouée) et transmet l'erreur.
Utilisation de then() pour gérer les Promises résolues :
Une fois la Promise créée, il est possible de traiter le résultat à l'aide de la méthode then()
. Cette méthode est appelée lorsque la Promise est accomplie (résolue).
myPromise.then(result => {
console.log(result); // Output: Task completed successfully!
});
Dans cet exemple, la méthode then()
reçoit la valeur transmise à resolve()
et exécute la fonction de rappel avec le résultat. Elle s'exécute uniquement si la Promesse est résolue avec succès.
Gestion des erreurs avec .catch()
Les Promesses offrent un moyen simple de gérer les erreurs via la méthode .catch()
. Si une Promesse est rejetée (échec), l'erreur est interceptée et traitée dans .catch()
.
1234567891011121314151617const myPromise = new Promise((resolve, reject) => { const success = false; // Simulate a failure if (success) { resolve('Task completed successfully!'); } else { reject('Task failed.'); } }); myPromise .then(result => { console.log(result); }) .catch(error => { console.error('Error:', error); // Output: Error: Task failed. });
La méthode catch()
est utilisée pour gérer les erreurs lorsque la Promesse est rejetée. Elle intercepte l’erreur transmise par reject()
et permet de gérer les scénarios d’échec.
Chaînage des Promesses pour des opérations asynchrones séquentielles
L’un des principaux avantages des Promesses est la possibilité de les chaîner, ce qui permet de gérer plusieurs opérations asynchrones de manière séquentielle sans tomber dans le callback hell. Chaque appel à then()
retourne une nouvelle Promesse, ce qui permet d’enchaîner plusieurs appels then()
successifs, avec les résultats affichés dans le HTML à mesure que chaque Promesse est résolue.
index.html
index.js
index.css
Opérations séquentielles : Chaque then()
retourne une nouvelle Promesse, transmettant le résultat d'une opération à la suivante. Cela permet une séquence linéaire et claire d'opérations asynchrones qui met à jour le texte affiché dans le HTML.
Gestion des erreurs : La méthode .catch()
gère toute erreur survenant lors de la résolution de n'importe quelle Promesse. Cela garantit que les erreurs sont capturées et affichées sur la page, quel que soit l'endroit où elles se produisent dans la chaîne.
Pourquoi utiliser les Promesses ?
- Éviter l'enfer des callbacks : Les Promesses offrent une manière plus propre et plus lisible de gérer les opérations asynchrones que les callbacks profondément imbriqués ;
- Gestion des erreurs : Les Promesses fournissent une gestion des erreurs intégrée avec
.catch()
, ce qui facilite la gestion des opérations rejetées ; - Chaînage séquentiel : Les Promesses permettent d'exécuter plusieurs opérations asynchrones en séquence grâce au chaînage, rendant le code plus facile à suivre et à maintenir.
1. Qu'est-ce qu'une Promesse ?
2. Dans le code suivant, que fera .catch()
s'il y a une erreur dans l'un des callbacks .then()
?
Merci pour vos commentaires !
Demandez à l'IA
Demandez à l'IA
Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion
Awesome!
Completion rate improved to 2.22
Gestion des Opérations Asynchrones avec les Promesses
Glissez pour afficher le menu
Qu'est-ce qu'une Promise ?
Une Promise est un espace réservé pour une valeur future, qui peut être :
Une promise commence avec l'état pending
et se termine définitivement soit en étant fulfilled
avec une valeur, soit en étant rejected
avec une raison.
Compréhension des méthodes resolve, reject et then()
Création d'une Promise
Pour créer une Promise, il faut passer une fonction avec deux paramètres : resolve
et reject
. Ces paramètres sont des fonctions utilisées pour indiquer si l'opération asynchrone a été réalisée avec succès ou a échoué.
const myPromise = new Promise((resolve, reject) => {
const success = true; // Simulate whether the task is successful
if (success) {
resolve('Task completed successfully!');
} else {
reject('Task failed.');
}
});
resolve(value)
: Marque la Promise comme accomplie (réussie) et transmet le résultat (value) ;reject(error)
: Marque la Promise comme rejetée (échouée) et transmet l'erreur.
Utilisation de then() pour gérer les Promises résolues :
Une fois la Promise créée, il est possible de traiter le résultat à l'aide de la méthode then()
. Cette méthode est appelée lorsque la Promise est accomplie (résolue).
myPromise.then(result => {
console.log(result); // Output: Task completed successfully!
});
Dans cet exemple, la méthode then()
reçoit la valeur transmise à resolve()
et exécute la fonction de rappel avec le résultat. Elle s'exécute uniquement si la Promesse est résolue avec succès.
Gestion des erreurs avec .catch()
Les Promesses offrent un moyen simple de gérer les erreurs via la méthode .catch()
. Si une Promesse est rejetée (échec), l'erreur est interceptée et traitée dans .catch()
.
1234567891011121314151617const myPromise = new Promise((resolve, reject) => { const success = false; // Simulate a failure if (success) { resolve('Task completed successfully!'); } else { reject('Task failed.'); } }); myPromise .then(result => { console.log(result); }) .catch(error => { console.error('Error:', error); // Output: Error: Task failed. });
La méthode catch()
est utilisée pour gérer les erreurs lorsque la Promesse est rejetée. Elle intercepte l’erreur transmise par reject()
et permet de gérer les scénarios d’échec.
Chaînage des Promesses pour des opérations asynchrones séquentielles
L’un des principaux avantages des Promesses est la possibilité de les chaîner, ce qui permet de gérer plusieurs opérations asynchrones de manière séquentielle sans tomber dans le callback hell. Chaque appel à then()
retourne une nouvelle Promesse, ce qui permet d’enchaîner plusieurs appels then()
successifs, avec les résultats affichés dans le HTML à mesure que chaque Promesse est résolue.
index.html
index.js
index.css
Opérations séquentielles : Chaque then()
retourne une nouvelle Promesse, transmettant le résultat d'une opération à la suivante. Cela permet une séquence linéaire et claire d'opérations asynchrones qui met à jour le texte affiché dans le HTML.
Gestion des erreurs : La méthode .catch()
gère toute erreur survenant lors de la résolution de n'importe quelle Promesse. Cela garantit que les erreurs sont capturées et affichées sur la page, quel que soit l'endroit où elles se produisent dans la chaîne.
Pourquoi utiliser les Promesses ?
- Éviter l'enfer des callbacks : Les Promesses offrent une manière plus propre et plus lisible de gérer les opérations asynchrones que les callbacks profondément imbriqués ;
- Gestion des erreurs : Les Promesses fournissent une gestion des erreurs intégrée avec
.catch()
, ce qui facilite la gestion des opérations rejetées ; - Chaînage séquentiel : Les Promesses permettent d'exécuter plusieurs opérations asynchrones en séquence grâce au chaînage, rendant le code plus facile à suivre et à maintenir.
1. Qu'est-ce qu'une Promesse ?
2. Dans le code suivant, que fera .catch()
s'il y a une erreur dans l'un des callbacks .then()
?
Merci pour vos commentaires !