Les Promesses en JavaScript


Les promesses sont un mécanisme de gestion asynchrone en JavaScript qui permet de gérer plus facilement les opérations asynchrones et d'éviter le "callback hell". Les promesses représentent la réussite ou l'échec d'une opération asynchrone et permettent d'attacher des callbacks pour traiter le résultat ou l'erreur lorsque l'opération est terminée.


1. Création d'une Promesse :


Pour créer une promesse, vous utilisez le constructeur Promise. Ce constructeur prend une fonction callback en argument, qui reçoit deux arguments : resolve et reject. resolve est appelé lorsque l'opération réussit, et reject est appelé lorsque l'opération échoue.


Exemple de Création d'une Promesse :


let maPromesse = new Promise(function(resolve, reject) {
    // Opération asynchrone (simulation avec setTimeout)
    setTimeout(function() {
        // Succès de l'opération
        resolve('Résultat réussi');
        
        // Échec de l'opération
        // reject('Erreur survenue');
    }, 2000);
});


2. Utilisation des Promesses :


Une fois qu'une promesse est créée, vous pouvez attacher des callbacks pour traiter le résultat ou l'erreur à l'aide des méthodes .then() et .catch(). La méthode .then() est utilisée pour traiter le succès de la promesse, tandis que la méthode .catch() est utilisée pour traiter l'échec.


Exemple d'Utilisation d'une Promesse :


maPromesse.then(function(resultat) {
    console.log('Opération réussie : ' + resultat);
}).catch(function(erreur) {
    console.error('Erreur survenue : ' + erreur);
});


3. Chaînage de Promesses :


Les promesses peuvent être chaînées pour exécuter des opérations asynchrones séquentiellement ou en parallèle. Chaque .then() retourne une nouvelle promesse, ce qui permet de chaîner des appels .then() les uns après les autres.


Exemple de Chaînage de Promesses :


maPromesse.then(function(resultat) {
    console.log('Première opération réussie : ' + resultat);
    return 'Nouvelle donnée';
}).then(function(nouveauResultat) {
    console.log('Deuxième opération réussie : ' + nouveauResultat);
}).catch(function(erreur) {
    console.error('Erreur survenue : ' + erreur);
});


4. Promesses en Parallèle :


Vous pouvez également utiliser Promise.all() pour exécuter plusieurs promesses en parallèle et attendre qu'elles se terminent toutes avant de traiter les résultats.


Exemple de Promesses en Parallèle :


let promesse1 = fetch('https://api.example.com/data1');
let promesse2 = fetch('https://api.example.com/data2');

Promise.all([promesse1, promesse2])
    .then(function(resultats) {
        // Traitement des résultats
    })
    .catch(function(erreur) {
        console.error('Erreur survenue : ' + erreur);
    });


5. Utilisation de Promises.resolve() et Promise.reject() :


Vous pouvez également créer des promesses résolues ou rejetées immédiatement en utilisant Promise.resolve() et Promise.reject().


Exemple :


let promesseResolue = Promise.resolve('Résultat immédiat');
let promesseRejetee = Promise.reject('Erreur immédiate');


En résumé, les promesses en JavaScript offrent une manière plus propre et plus intuitive de gérer les opérations asynchrones. En comprenant comment créer des promesses, les chaîner, les utiliser en parallèle et les gérer avec les méthodes .then() et .catch(), vous pouvez écrire un code asynchrone plus clair et plus maintenable.

678 vues
Posté le 15 mai 2024
Publicité Sitedudev
Cette pub permet au site de vivre ...
Publicité
Cette pub permet au site de vivre ...
Voir d'autres articles
4 939 vues
Afficher la liste des topics
Dans notre dossier f_forum, nous allons créer une nouvelle page sujet.php. Cette page affichera la liste des topiques créer par les utilisateurs de votre site en fonction de la catégorie...
Créer son site
1 609 vues
Sélecteurs d'ID : appliquer des styles à des éléments individuels
Sélecteurs d'ID : Appliquer des styles à des éléments individuelsLes sélecteurs d'ID sont des outils en CSS qui permettent d'appliquer des styles à des éléments HTML spécifiques....
CSS
5 330 vues
Ajout d'images avec <img> et attributs src, alt et width
Ajout d'images avec <img> et attributs src, alt et widthLa balise <img> est utilisée pour afficher des images dans une page HTML. Elle nécessite l'utilisation de certains attributs pour...
HTML
12 605 vues
Barre de recherche : Ajax
À partir de maintenant nous allons développer notre script permettant de contacter une page et de l'exécuter afin d'afficher le résultat de notre saisie.Nous allons commencer par mettre cette...
Créer son site
10 823 vues
Valider son compte avec un mail
Dans cet article nous allons développer un système qui permettra d'envoyer un mail à votre nouvel utilisateur avec une clé afin de confirmer son compte sur votre site.Pour commencer il faudra...
Créer son site
4 609 vues
L'expression if ... else - PHP
Lorsque vous écrivez votre code, il vous arrive souvent de vouloir effectuer des actions différentes en fonction de différentes conditions. C'est à ce moment que l'instruction if et else va vous...
3 653 vues
Afficher ses utilisateurs en PHP
Maintenant que nous avons créé notre formulaire d’inscription et de connexion nous allons afficher tous nos utilisateurs du site afin de visiter par la suite les autres profils du site.
Créer son site de rencontres
840 vues
Utilisation de gradients, ombres et transitions pour des effets visuels
Utilisation de Gradients, Ombres et Transitions pour des Effets VisuelsEn CSS, vous pouvez utiliser des gradients, des ombres et des transitions pour ajouter des effets visuels attrayants à vos...
CSS
Publicité
Cette pub permet au site de vivre ...