incompréhension await et Promise

Bonjour.

Je travaille sur un bot Discord avec discord.js, et ce dernier utilise les Promises.
Je découvre donc les mots-clés await et async, et j'ai écrit ce code (log() étant un wrapper de console.log()) :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

function registerGuild(guild) { let Promise1 = guild.members.fetch(userId); let Promise2 = guild.roles.fetch();   log(1); let promiseExecution = async () => { log(3); let promise = await Promise.all([Promise1, Promise2]); log(4); return promise; } log(2); promiseExecution() .then(data => {/**/}) .catch(console.error); log(5); }

---

Je m'attends à voir 1 2 3 4 5, mais je vois 1 2 3 5. Et effectivement c'est comme si la fonction s'arrête subitement à la ligne 8. Pourtant le log(5) est bien executé.

Je dois rater quelque chose mais je comprends pas.

le mot-clef "await" pourrait se traduire en francais par "attend"
donc ta ligne 8 "attend" que Promise1 et Promise2 se resolvent pour continuer.

il se peut que Promise1 ou Promise2 ne reponde pas... et c'est pour ca que tu ne vois pas ton log 4

Citation:

---

Envoyé par Doksuri

le mot-clef "await" pourrait se traduire en francais par "attend"

---

C'est bien ça qui me contrarie, je pensais que le mot-clé await faisait que la fonction promiseExection() attende que les deux Promise soient résolues, mais ça n'est pas le cas. Et je n'ai pas de message d'erreur.

Cela dit le fait qu'une des Promise ne s'effectue pas correctement est une piste, je vais creuser par là.

Citation:

---

Envoyé par Daïmanu

je pensais que le mot-clé await faisait que la fonction promiseExection() attende que les deux Promise soient résolues

---

oui c'est bien ce qu'il se passe, c'est pour ça que le "4" s'affiche plus tard.
par contre, la fonction "registerGuild" démarre seulement la promesse "promiseExection" et n'attend pas la réponse, c'est pour ça que le "5" s'affiche à la suite.

l'utilisation de async et await est juste une autre façon d'utiliser une promesse et "then", regardez cet exemple là :
https://www.developpez.net/forums/d2.../#post11899853

Merci pour le lien, je sentais que j'utilisais mal le then(), ça me simplifie les choses.

Le souci vient visiblement de la fonction appelante, qui était ordinaire (sans await). En rajoutant ce mot-clé, ça attend bien comme je le veux.

En passant de :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

function registerGuild(guild) { let promise1 = guild.members.fetch(); let promise2 = guild.roles.fetch();   let promiseExecution = async () => { return await Promise.all([promise1, promise2]); }   promiseExecution() .then(data => {/* */}) .catch(console.error); }   client.on('messageCreate', message => { registerGuild(message.guild); }

---

À ce code :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13

async function registerGuild(guild) { let promise1 = guild.members.fetch(); let promise2 = guild.roles.fetch();   const response = await Promise.all([promise1, promise2]); const x = response[0]; const y = response[1]; /* */ }   client.on('messageCreate', async message => { await registerGuild(message.guild); }

---

J'ai réussi à faire marcher comme je le voulais, maintenant ce n'est peut-être pas la meilleure manière de faire.
Je vais explorer encore un peu, mais en l'état ça me va.

dans l'évènement "messageCreate", vous n'attendez pas de valeur en retour donc je pense que vous pouvez simplifier comme cela :

Code:

---

client.on('messageCreate', message => registerGuild(message.guild));

---

je viens de voir le souci dans votre 1re version du code, quand vous faites return await Promise.all([promise1, promise2]); vous retournez le résultat des 2 promesses et non une nouvelle promesse. regardez dans votre 2e version du code, vous faites la même chose.

Citation:

---

Envoyé par mathieu

dans l'évènement "messageCreate", vous n'attendez pas de valeur en retour donc je pense que vous pouvez simplifier comme cela :

Code:

---

client.on('messageCreate', message => registerGuild(message.guild));

---

---

Je ne l'ai pas précisé, mais il y a d'autres instructions dans cette fonction.

Citation:

---

Envoyé par mathieu

je viens de voir le souci dans votre 1re version du code, quand vous faites return await Promise.all([promise1, promise2]); vous retournez le résultat des 2 promesses et non une nouvelle promesse. regardez dans votre 2e version du code, vous faites la même chose.

---

Comment je fais alors pour attendre que les deux promesses soient terminées, pour passer à un mode synchrone ?

Bonjour,

Citation:

---

Comment je fais alors pour attendre que les deux promesses soient terminées, pour passer à un mode synchrone ?

---

tu attends que les promesses soient terminées :mrgreen:

Plus sérieusement prenons un petit exemple.

Commençons par la déclaration des promises :

Code:

---

1 2 3 4 5 6 7 8 9 10

const promise1 = new Promise((resolve, reject) => { resolve("first"); }); const promise2 = new Promise((resolve, reject) => { setTimeout(()=> resolve("second"), 1000); // avec retard }); const promise3 = new Promise((resolve, reject) => { resolve("third"); }); const promise4 = "etc ...";

---

Nota : une promesse est crée avec un retard pour montrer qu'au final les retours seront bien dans l'ordre d'appel.

Rappel : si une des promesses échoue la promesse Promise.all échoue.

Créons une fonction d'appel pour résoudre celles-ci :

Code:

---

1 2 3 4 5 6 7

function getResultat() { Promise.all([promise1, promise2, promise3, promise4]) .then((response) => { // ici toutes les données sont disponibles dans l'ordre d'appel console.log("In promise :", response); }); }

---

... les données sont traitées directement dans le then().

On peut également traiter les réponses directement dans le then() en passant par une fonction de rappel, callback.

Code:

---

1 2 3 4 5 6 7

function getResultat(callback) { Promise.all([promise1, promise2, promise3, promise4]) .then((response) => { // ici toutes les données sont disponibles dans l'ordre d'appel callback && callback(response); }); }

---

... cela permet souvent d'avoir un code plus lisible.

Avec une fonction callback, l'appel pourrait ressembler à :

Code:

---

1 2 3 4 5 6

console.log("(1) Avant"); getResultat((data) => { console.log("getResultat :", data); // ou tout autre fonction }); console.log("(2) Après");

---

Le résultat obtenu sera :

Code:

---

1 2 3

> "(1) Avant" > "(2) Après" > "getResultat :" Array ["first", "second", "third", "etc ..."]

---

Maintenant on pourrait envisager de traiter les données en retour de promesse, dans ce cas c'est une promesse qui est retournée, il nous faut donc utiliser le résultat dans le then().

Créons une fonction d'appel pour résoudre celles-ci :

Code:

---

1 2 3

function getResultat() { return Promise.all([promise1, promise2, promise3, promise4]); }

---

Le traitement se fera dans le then() de la fonction getResultat(), qui est une promesse.

Code:

---

1 2 3 4 5 6 7

console.log("(1) Avant"); getResultat() // appel de la fonction .then((data) => { // traitement dans le then // ici toutes les données sont disponibles dans l'ordre d'appel console.log("Out promise :", data); }) console.log("(2) Après");

---

Le résultat sera le même que précédemment :

Code:

---

1 2 3

> "(1) Avant" > "(2) Après" > "Out promise :" Array ["first", "second", "third", "etc ..."]

---

Une autre façon de voir les choses avec le couple async/await serait cette forme par exemple :

Code:

---

1 2 3 4 5 6 7 8 9 10

async function getResultat() { const response = await Promise.all([promise1, promise2, promise3, promise4]); // ici toutes les données sont disponibles dans l'ordre d'appel console.log("await :", response); }   // appel à la fonction console.log("(1) Avant"); getResultat(); console.log("(2) Après");

---

et toujours le même ordre dans la console :

Code:

---

1 2 3

> "(1) Avant" > "(2) Après" > "await :" Array ["first", "second", "third", "etc ..."]

---

Tu vois que tu as l’embarras du choix quant à la façon d'implémenter ton code ;)