Discussion :

[achevtsov]

Bonjour à tous,

Quelqu'un pourrait-il m'expliquer ce morceau de code ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
            const promise1 = fetch("https://jsonplaceholder.typicode.com/posts/1");
            const promise2 = fetch("https://jsonplaceholder.typicode.com/posts/2");
 
            Promise.all([promise1, promise2])
            .then((responses) => {
                return Promise.all(responses.map((response) => response.json()));
            })
            .then((data) => {
                console.log(data);
            })
            .catch((err) => console.error(err));

C'est précisément le premier .then que j'ai du mal à comprendre.
Comment se fait-il qu'on utilise deux fois Promise.all ?

Quel est le lien entre le tableau de Response renvoyé par Promise.all([promise1, promise2]) et le tableau de Promise renvoyé par responses.map((response) => response.json()) ?

Merci d'avance et bonne journée,

Andreï

[licardentaistor]

Le premier Promise.all sert à attendre que toutes les requêtes HTTP soient terminées et à récupérer les objets Response.
Le deuxième Promise.all sert à attendre que tous ces objets Response soient convertis en JSON.

[achevtsov]

Bonjour,

Merci pour cette réponse.

Un peu de recherche (pas évidente) sur la méthode .json() de Response m'a permis de comprendre que response.json() ne renvoie pas un objet JSON, comme je l'imaginais, mais une promesse qui se résout en JSON. Pareil pour .blob(), .text(), etc.

Du coup, si je comprends bien, à chaque fois qu'on utilise Promise.all avec fetch, il faudra l'utiliser deux fois ?

Cela veut-il dire que .json(), .blob(), etc. sont des opérations asynchrones ?

Merci d'avance.

[domi65]

Cela veut-il dire que .json(), .blob(), etc. sont des opérations asynchrones ?

Bonjour. C'est then en fait qui renvoie une nouvelle promesse. Donc, en effet une opération asynchrone.