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.

809 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
2 657 vues
Ajouter un avatar
Nous allons maintenant ajouter des avatars à nos profils et afficher ses avatars lors de l’affichage des membres 😁
Créer son site de rencontres
4 298 vues
Mise en évidence du texte avec <em>, <strong>, <u> et <s>
Mise en évidence du texte avec <em>, <strong>, <u> et <s>Les balises <em>, <strong>, <u> et <s> sont utilisées pour mettre en évidence le texte dans...
HTML
900 vues
Sélecteurs d'attribut : styliser en fonction des attributs des éléments HTML
Sélecteurs d'Attribut : Styliser en fonction des attributs des éléments HTMLLes sélecteurs d'attribut en CSS permettent de cibler des éléments HTML en fonction de la présence ou de la valeur...
CSS
2 874 vues
Modifier ses informations en PHP
Dans cette nouvelle vidéo nous allons apprendre à modifier vos informations !Lors de l’inscription il se peut que vous ayez fait une erreur. C'est pour cela que cette page sera importante pour...
Créer son site de rencontres
4 232 vues
Définir l'encodage de caractères avec <meta charset="utf-8">
Définir l'encodage de caractères avec <meta charset="utf-8">L'encodage de caractères définit la correspondance entre les caractères et les valeurs binaires utilisées par l'ordinateur....
HTML
1 780 vues
Afficher plus de conversation
Dans cette avant-dernière vidéo sur la création d’une messagerie interne nous allons personnaliser rapidement la page pour afficher les conversations et nous allons également corriger /...
Créer son site de rencontres
4 294 vues
Créer un topic
Créer un topicDans notre dossier **f_forum**, nous allons créer une nouvelle page creer_topic.php. Cette page permettra à vos utilisateurs de pouvoir créer un topic afin de demande de l'aide,...
Créer son site
994 vues
Comment ces propriétés affectent le positionnement et la mise en page des éléments
Impact des Propriétés de Marge, Bordure, Rembourrage, Largeur et Hauteur sur le Positionnement et la Mise en Page des ÉlémentsEn CSS, les propriétés de marge, bordure, rembourrage, largeur et...
CSS
Publicité
Cette pub permet au site de vivre ...