Promesses Javascript

Qu'est-ce qu'une promesse en JavaScript : Un aperçu

• en attente : État initial, ni rempli ni rejeté.
• fulfilled (accomplie) : L'opération s'est terminée avec succès.
• rejetée : L'opération a échoué.

Comment fonctionnent les promesses en JavaScript

Promise(executor)

function(resolve, reject)

let promise = new Promise(function(resolve, reject) { // exécuteur (le code producteur) }) ;

Programmation asynchrone avec les promesses en JavaScript

let promise = new Promise(function(resolve, reject) { setTimeout(() => resolve(1), 1000) ; }) .then(result => { console.log(result) ; // 1 return result * 2 ; }) .then(result => { console.log(result) ; // 2 return result * 3 ; })

Exploration des méthodes Javascript Promise

Méthodes Javascript Promise couramment utilisées

promise.then( function(result) { /* handle successful resolution */ }, function(error) { /* handle error */ } ) ;

promise.catch( function(error) { /* gérer l'erreur */ } ) ;

promise.finally( function() { /* code à exécuter après le règlement de la promesse */ } ) ;

Mise en œuvre des méthodes de promesse Javascript dans la programmation

let imgLoad = new Promise(function(resolve, reject) { let img = new Image() ; img.src = 'path/to/image.jpg' ; img.onload = function() { resolve(img) ; } ; img.onerror = function() { reject('Error loading image.') ; } ; }) ;

imgLoad.then( function(img) { document.body.append(img) ; }, function(error) { console.log(error) ; } ) ;

imgLoad.then( function(img) { document.body.append(img) ; } ).catch(function(error) { console.log('Error occurred.', error) ; }) ;

Exemples de promesses en Javascript : Une visite guidée

Exemple simple de promesse JavaScript pour les débutants

let hasEnoughMoney = new Promise(function(resolve, reject) { let money = 500 ; // L'utilisateur a 500 £ let price = 400 ; // L'article coûte 400 £ if(money >= price) { resolve('Vous pouvez acheter l'article!') ; } else { reject('Désolé, mais vous n'avez pas les moyens d'acheter cet article.') ; } }) ; // Utilisation de l'objet Promise hasEnoughMoney.then(function(message) { console.log(message) ; // Enregistre "Vous pouvez acheter l'article !" }).catch(function(error) { console.log(error) ; // Enregistre "Désolé, mais vous ne pouvez pas acheter cet article." si l'utilisateur n'a pas assez d'argent }) ;

Exemple avancé de promesse Javascript pour les apprenants plus expérimentés

function waitAndLog(seconds) { return new Promise(function(resolve, reject) { if (seconds < 1 || seconds > 5) { reject('Input must be between 1 and 5.') ; } else { setTimeout(function() { resolve(`Attendu pendant ${seconds} secondes.`) ; }, seconds * 1000) ; } }) ; }

waitAndLog(2) .then(function(message) { console.log(message) ; return waitAndLog(3) ; }) .then(function(message) { console.log(message) ; return waitAndLog(4) ; }) .then(function(message) { console.log(message) ; }) .catch(function(error) { console.error(error) ;

) ;

Apprendre le chaînage de promesses en Javascript

Qu'est-ce qu'une chaîne de promesses en JavaScript ?

Enchaîner plusieurs promesses Javascript : Guide étape par étape

// Notre hypothétique fonction asynchrone pour simuler la lecture d'un livre. function readBook(bookName) { return new Promise(function(resolve, reject) { setTimeout(function() { resolve(`Finished reading ${bookName}`) ; }, Math.floor(Math.random() * 5000) + 1000) ; // La lecture dure de 1 à 5 secondes }) ; } // Maintenant, nous enchaînons le processus de lecture readBook('Book 1') .then(message => { console.log(message) ; return readBook('Book 2') ; }) .then(message => { console.log(message) ; return readBook('Book 3') ; }) .then(message => { console.log(message) ; }) .catch(error => { console.log(`Error occurred : ${error}`) ;

) ;

Plongée en profondeur dans la promesse d'attente JavaScript

Comment 'Await' affecte-t-il les promesses en Javascript ?

• 'await' met l'exécution de la fonction asynchrone en pause et attend la résolution de la Promesse.
• 'await' ne peut être utilisé qu'à l'intérieur d'une fonction asynchrone.
• Si la promesse se réalise, le mot-clé 'await' récupère la valeur résolue.
• Si la promesse est rejetée, elle génère une erreur qui peut être rattrapée à l'aide de 'catch'.

Utilisation de 'Await' en Javascript Promise : un exemple

async function fetchShoesInOrder(ids) { for (let id of ids) { try { const shoe = await getShoeByID(id) ; // Se met en pause jusqu'à ce que la promesse se réalise console.log(`Fetched shoe with ID ${id} : ${shoe}`) ; } catch(error) { console.log(`Error : Could not fetch the shoe with ID ${id} : ${error}`) ;