Que faire avec une promesse ?
Bonjour,
Quelque chose m'échappe, lorsque je fait une requête Fetch asynchrone, je suis dans l'attente de recevoir des données.
Ensuite je souhaite manipuler ces données, comme par exemple les ajouter dans une array pour pouvoir travailler dessus de manière globale.
Mais ce qu'il se passe c'est que je travaille sur une array undefined car la promesse ne s'est pas résolu.
Comment faire pour que mon array push les données reçu uniquement lorsqu'elle sont chargés et pas à l'état de promesse ?
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
| var allData = [];
function getOneProduct(product_id){
let data;
fetch('http://localhost:3000/api/things/' + product_id)
.then(async response => {
data = await response.json()
.then(data => requestData = data);
allData.push(requestData);
/* ici je rentre une promise dans mon array, et donc ensuite mon code ne fonctionne pas lorsque je veux travailler sur mon array*/
}
)}
console.log(allData); /*me retourne une promise, comment faire à partir de là pour demander à mon code de s'exécuter seulement quand les données sont arrivés ?*/ |
J'ai pas mal cherché et cela n'a pas l'air d'être un soucis pour la plupart des développeurs, j'ai peut être raté quelque chose ?
Alors oui biensur je pourrais utiliser un set timeout random de 1 à 2 s, mais quel interêt ? et personne ne télécharge des données à la même vitesse...
Les données ne sont pas détéctables
Bonjour, Merci à tous les deux pour votre aide,
Doksuri, la proposition n'a rien changé, je ne peux pas travailer directement sur allData tant que je ne suis pas sur que toutes les données sont implantés...
mathieu, en effet le fait de travailler dans une fonction est intéressant mais finalement ça ne me permet toujours pas de savoir si mes données sont chargées.
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
var allData = [];
function getOneProduct(product_id){
let data;
fetch('http://localhost:3000/api/things/' + product_id)
.then(async response => {
data = await response.json()
.then(data => requestData = data);
useData(requestData);
}
)}
function useData(data){
allData.push(data);
if (allData.length === 5){
for (i in allData){
console.log(allData[i]);
}}
}
getOneProduct(/*je passe 5 id avec une boucle*/) |
Voici le résultat, effectivement en mettant une condition avec if, cela permet d'attendre les 5 tours de boucle dans getOneProduct et à ce moment les données sont chargés, mais cela ne me parait pas propre :
-si les données mettent plus de temps à charger avec une autre connexion ou pour x ou y raison
-si je dois appeler un autre type de données plus lourdes qui ne seront pas chargés avant la fin de la boucle
Comment faites vous habituellement pour vous assurez que la promesse est résolu avant de travailler sur les données ?
Merci de votre attention et de votre aide
