Skip to content

Commit 3b39399

Browse files
authored
Merge pull request #110 from xsteacy/master
Promise API
2 parents b3ff48a + ae1e5f1 commit 3b39399

File tree

1 file changed

+68
-68
lines changed

1 file changed

+68
-68
lines changed
Lines changed: 68 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,40 @@
1-
# Promise API
1+
# Promesse API
22

3-
There are 5 static methods in the `Promise` class. We'll quickly cover their use cases here.
3+
Il y a 5 méthodes statiques dans la classe `Promise`. Nous allons rapidement couvrir leurs usages ici.
44

55
## Promise.all
66

7-
Let's say we want to run many promises to execute in parallel, and wait till all of them are ready.
7+
Disons que nous voulons exécuter de nombreuses promesses, et ce en parallèle, et attendre qu'elles soient toutes prêtes.
88

9-
For instance, download several URLs in parallel and process the content when all are done.
9+
Par exemple, téléchargez plusieurs URLs en parallèle et traitez le contenu lorsque tout est terminé.
1010

11-
That's what `Promise.all` is for.
11+
C'est à cela que sert `Promise.all`.
1212

13-
The syntax is:
13+
La syntaxe est:
1414

1515
```js
1616
let promise = Promise.all([...promises...]);
1717
```
1818

19-
`Promise.all` takes an array of promises (technically can be any iterable, but usually an array) and returns a new promise.
19+
`Promise.all` prend un tableau de promesses (techniquement, cela peut être n'importe quel itérable, mais est généralement un tableau) et retourne une nouvelle promesse.
2020

21-
The new promise resolves when all listed promises are settled and the array of their results becomes its result.
21+
La nouvelle promesse est résolue lorsque toutes les promesses énumérées sont réglées et que le tableau de leurs résultats devient son résultat.
2222

23-
For instance, the `Promise.all` below settles after 3 seconds, and then its result is an array `[1, 2, 3]`:
23+
Par exemple, le `Promise.all` ci-dessous se règle après 3 secondes, et ensuite son résultat est un tableau `[1, 2, 3]`:
2424

2525
```js run
2626
Promise.all([
2727
new Promise(resolve => setTimeout(() => resolve(1), 3000)), // 1
2828
new Promise(resolve => setTimeout(() => resolve(2), 2000)), // 2
2929
new Promise(resolve => setTimeout(() => resolve(3), 1000)) // 3
30-
]).then(alert); // 1,2,3 when promises are ready: each promise contributes an array member
30+
]).then(alert); // 1,2,3 quand les promesses sont prêtes : chaque promesse apporte un élément du tableau
3131
```
3232

33-
Please note that the order of resulting array members is the same as source promises. Even though the first promise takes the longest time to resolve, it's still first in the array of results.
33+
Veuillez noter que l'ordre des éléments du tableau résultant est le même que celui des promesses source. Même si la première promesse prend le plus de temps à se concrétiser, elle est toujours la première dans le tableau des résultats.
3434

35-
A common trick is to map an array of job data into an array of promises, and then wrap that into `Promise.all`.
35+
Une astuce courante consiste à mapper un tableau de données de tâches dans un tableau de promesses, puis à l'intégrer dans `Promise.all`.
3636

37-
For instance, if we have an array of URLs, we can fetch them all like this:
37+
Par exemple, si nous avons un tableau d'URLs, nous pouvons tous les récupérer comme ceci:
3838

3939
```js run
4040
let urls = [
@@ -43,17 +43,17 @@ let urls = [
4343
'https://api.github.com/users/jeresig'
4444
];
4545

46-
// map every url to the promise of the fetch
46+
// mappe chaque url à la promesse du fetch
4747
let requests = urls.map(url => fetch(url));
4848

49-
// Promise.all waits until all jobs are resolved
49+
// Promise.all attend jusqu'à ce que toutes les tâches soient résolues
5050
Promise.all(requests)
5151
.then(responses => responses.forEach(
5252
response => alert(`${response.url}: ${response.status}`)
5353
));
5454
```
5555

56-
A bigger example with fetching user information for an array of GitHub users by their names (we could fetch an array of goods by their ids, the logic is same):
56+
Voici un plus gros exemple avec la récupération des informations des utilisateurs GitHub dans un tableau, par leurs noms (nous pourrions récupérer un tableau de biens par leurs identifiants, la logique est la même):
5757

5858
```js run
5959
let names = ['iliakan', 'remy', 'jeresig'];
@@ -62,22 +62,22 @@ let requests = names.map(name => fetch(`https://api.github.com/users/${name}`));
6262

6363
Promise.all(requests)
6464
.then(responses => {
65-
// all responses are resolved successfully
65+
// toutes les réponses sont résolues avec succès
6666
for(let response of responses) {
67-
alert(`${response.url}: ${response.status}`); // shows 200 for every url
67+
alert(`${response.url}: ${response.status}`); // affiche 200 pour chaque url
6868
}
6969

7070
return responses;
7171
})
72-
// map array of responses into array of response.json() to read their content
72+
// mappe le tableau de "responses" dans le tableau "response.json()" pour lire leurs contenus
7373
.then(responses => Promise.all(responses.map(r => r.json())))
74-
// all JSON answers are parsed: "users" is the array of them
74+
// toutes les réponses JSON sont analysées : "users" est leur tableau
7575
.then(users => users.forEach(user => alert(user.name)));
7676
```
7777

78-
**If any of the promises is rejected, the promise returned by `Promise.all` immediately rejects with that error.**
78+
**Si l'une des promesses est rejetée, la promesse retournée par `Promise.all` est rejetée immédiatement avec cette erreur.**
7979

80-
For instance:
80+
Par exemple:
8181

8282
```js run
8383
Promise.all([
@@ -89,20 +89,20 @@ Promise.all([
8989
]).catch(alert); // Error: Whoops!
9090
```
9191

92-
Here the second promise rejects in two seconds. That leads to immediate rejection of `Promise.all`, so `.catch` executes: the rejection error becomes the outcome of the whole `Promise.all`.
92+
Ici, la deuxième promesse est rejetée en deux secondes. Cela conduit au rejet immédiat de `Promise.all`, donc `.catch` s'exécute: l'erreur de rejet devient le résultat de l'ensemble `Promise.all`.
9393

94-
```warn header="In case of an error, other promises are ignored"
95-
If one promise rejects, `Promise.all` immediately rejects, completely forgetting about the other ones in the list. Their results are ignored.
94+
```warn header="En cas d'erreur, les autres promesses sont ignorées."
95+
Si une promesse est rejetée, `Promise.all` est immédiatement rejetée, oubliant complètement les autres dans la liste. Leurs résultats sont ignorés.
9696
97-
For example, if there are multiple `fetch` calls, like in the example above, and one fails, other ones will still continue to execute, but `Promise.all` won't watch them anymore. They will probably settle, but the result will be ignored.
97+
Par exemple, s'il y a plusieurs appels `fetch, comme dans l'exemple ci-dessus, et que l'un d'eux échoue, les autres continueront à s'exécuter, mais `Promise.all` ne les considérera plus. Ils vont probablement se régler, mais le résultat sera ignoré.
9898
99-
`Promise.all` does nothing to cancel them, as there's no concept of "cancellation" in promises. In [another chapter](info:fetch-abort) we'll cover `AbortController` that can help with that, but it's not a part of the Promise API.
99+
`Promise.all` ne fait rien pour les annuler, car il n'y a pas de concept "d'annulation" dans les promesses. Dans[un autre chapitre](info:fetch-abort) nous couvrirons `AbortController` qui peut vous aider avec cela, mais ce n'est pas une partie de l'API Promise.
100100
```
101101

102-
````smart header="`Promise.all(iterable)` allows non-promise \"regular\" values in `iterable`"
103-
Normally, `Promise.all(...)` accepts an iterable (in most cases an array) of promises. But if any of those objects is not a promise, it's passed to the resulting array "as is".
102+
````smart header="`Promise.all(iterable)` autorise toutes les valeurs \"régulières\" qui ne sont pas une promesse dans `iterable`"
103+
Normallement, `Promise.all(...)` accepte un itérable (dans la plupart des cas, un tableau) de promesses. Mais si l'un de ces objets n'est pas une promesse, il est transmis au tableau résultant "tel quel".
104104

105-
For instance, here the results are `[1, 2, 3]`:
105+
Par exemple, ici les résultats sont les suivants `[1, 2, 3]`:
106106

107107
```js run
108108
Promise.all([
@@ -114,31 +114,31 @@ Promise.all([
114114
]).then(alert); // 1, 2, 3
115115
```
116116

117-
So we are able to pass ready values to `Promise.all` where convenient.
117+
Ainsi, nous sommes en mesure de passer des valeurs disponibles à `Promise.all` où cela nous convient.
118118
````
119119
120120
## Promise.allSettled
121121
122122
[recent browser="new"]
123123
124-
`Promise.all` rejects as a whole if any promise rejects. That's good for "all or nothing" cases, when we need *all* results to go on:
124+
`Promise.all` rejette dans son ensemble si une quelconque promesse est rejetée. Cela est bon pour les cas "tout ou rien", quand on a besoin de *tous* les résultats pour continuer:
125125
126126
```js
127127
Promise.all([
128128
fetch('/template.html'),
129129
fetch('/style.css'),
130130
fetch('/data.json')
131-
]).then(render); // render method needs results of all fetches
131+
]).then(render); // la méthode "render" a besoin des résultats de tous les "fetchs"
132132
```
133133
134-
`Promise.allSettled` waits for all promises to settle. The resulting array has:
134+
`Promise.allSettled` attend que toutes les promesses se règlent. Le tableau résultant a:
135135
136-
- `{status:"fulfilled", value:result}` for successful responses,
137-
- `{status:"rejected", reason:error}` for errors.
136+
- `{status:"fulfilled", value:result}` pour les réponses réussies,
137+
- `{status:"rejected", reason:error}` pour les erreurs.
138138
139-
For example, we'd like to fetch the information about multiple users. Even if one request fails, we're still interested in the others.
139+
Par exemple, nous aimerions récupérer l'information sur les utilisateurs multiples. Même si une demande échoue, les autres nous intéressent.
140140
141-
Let's use `Promise.allSettled`:
141+
Utilisons `Promise.allSettled`:
142142
143143
```js run
144144
let urls = [
@@ -160,7 +160,7 @@ Promise.allSettled(urls.map(url => fetch(url)))
160160
});
161161
```
162162
163-
The `results` in the line `(*)` above will be:
163+
Les `résultats` dans la ligne `(*)` ci-dessus seront:
164164
```js
165165
[
166166
{status: 'fulfilled', value: ...response...},
@@ -169,11 +169,11 @@ The `results` in the line `(*)` above will be:
169169
]
170170
```
171171
172-
So, for each promise we get its status and `value/error`.
172+
Ainsi, pour chaque promesse, nous obtenons son statut et `value/error`.
173173
174174
### Polyfill
175175
176-
If the browser doesn't support `Promise.allSettled`, it's easy to polyfill:
176+
Si le navigateur ne prend pas en charge `Promise.allSettled`, il est facile de le polyfill:
177177
178178
```js
179179
if(!Promise.allSettled) {
@@ -189,23 +189,23 @@ if(!Promise.allSettled) {
189189
}
190190
```
191191
192-
In this code, `promises.map` takes input values, turns into promises (just in case a non-promise was passed) with `p => Promise.resolve(p)`, and then adds `.then` handler to every one.
192+
Dans ce code, `promises.map` prend les valeurs d'entrée, les transforme en promesses (juste au cas où autre chose qu'une promesse serait transmis) avec `p => Promise.resolve(p)`, puis ajoute le gestionnaire `.then` à chacun.
193193
194-
That handler turns a successful result `v` into `{state:'fulfilled', value:v}`, and an error `r` into `{state:'rejected', reason:r}`. That's exactly the format of `Promise.allSettled`.
194+
Ce gestionnaire transforme un résultat réussi `v` en `{state:'fulfilled', value:v}`, et une erreur `r` en `{state:'rejected', reason:r}`. C'est exactement le format de `Promise.allSettled`.
195195
196-
Then we can use `Promise.allSettled` to get the results or *all* given promises, even if some of them reject.
196+
Ensuite, nous pouvons utiliser `Promise.allSettled` pour obtenir les résultats ou *toutes* les promesses données, même si certaines d'entre elles sont rejetées.
197197
198198
## Promise.race
199199
200-
Similar to `Promise.all`, but waits only for the first settled promise, and gets its result (or error).
200+
Similaire à `Promise.all`, mais n'attend que la première promesse réglée, et obtient son résultat (ou erreur).
201201
202-
The syntax is:
202+
La syntaxe est :
203203
204204
```js
205205
let promise = Promise.race(iterable);
206206
```
207207
208-
For instance, here the result will be `1`:
208+
Par exemple, ici, le résultat sera `1` :
209209
210210
```js run
211211
Promise.race([
@@ -215,26 +215,26 @@ Promise.race([
215215
]).then(alert); // 1
216216
```
217217
218-
The first promise here was fastest, so it became the result. After the first settled promise "wins the race", all further results/errors are ignored.
218+
La première promesse a été la plus rapide, donc, elle est devenue le résultat. Après la première promesse faite " vainqueur de la course ", tous les autres résultats/erreurs sont ignorés.
219219
220220
221221
## Promise.resolve/reject
222222
223-
Methods `Promise.resolve` and `Promise.reject` are rarely needed in modern code, because `async/await` syntax (we'll cover it in [a bit later](info:async-await)) makes them somewhat obsolete.
223+
Les méthodes `Promise.resolve` et `Promise.reject` sont rarement nécessaires dans le code moderne, parce que la syntaxe `async/await` (nous les couvrirons dans [un peu plus tard](info:async-await)) les rend en quelque sorte obsolètes.
224224
225-
We cover them here for completeness, and for those who can't use `async/await` for some reason.
225+
Nous les couvrons ici par souci de clarté, et pour ceux qui ne peuvent pas utiliser `async/await` pour une quelconque raison.
226226
227-
- `Promise.resolve(value)` creates a resolved promise with the result `value`.
227+
- Promise.resolve(value) " crée une promesse résolue avec le résultat `value`.
228228
229-
Same as:
229+
Comme pour:
230230
231231
```js
232232
let promise = new Promise(resolve => resolve(value));
233233
```
234234
235-
The method is used for compatibility, when a function is expected to return a promise.
235+
La méthode est utilisée pour la compatibilité, lorsqu'une fonction est censée renvoyer une promesse.
236236
237-
For example, `loadCached` function below fetches URL and remembers (caches) its content. For future calls with the same URL it immediately gets the previous content from cache, but uses `Promise.resolve` to make a promise of it, so that the returned value is always a promise:
237+
Par exemple, la fonction `loadCached` ci-dessous récupère l'URL et mémorise (met en cache) son contenu. Pour les appels futurs avec la même URL, il récupère immédiatement le contenu précédent du cache, mais utilise `Promise.resolve` pour en faire une promesse, de sorte que la valeur retournée soit toujours une promesse:
238238
239239
```js
240240
let cache = new Map();
@@ -255,30 +255,30 @@ function loadCached(url) {
255255
}
256256
```
257257
258-
We can write `loadCached(url).then()`, because the function is guaranteed to return a promise. We can always use `.then` after `loadCached`. That's the purpose of `Promise.resolve` in the line `(*)`.
258+
Nous pouvons écrire `loadCached(url).then(...)`, car la fonction est garantie de renvoyer une promesse. Nous pouvons toujours utiliser `.then` après `loadCached`. C'est le but de `Promise.resolve` dans la ligne `(*)`.
259259
260260
### Promise.reject
261261
262-
- `Promise.reject(error)` creates a rejected promise with `error`.
262+
- `Promise.reject(error)` crée une promesse rejetée avec `error`.
263263
264-
Same as:
264+
Comme pour:
265265
266266
```js
267267
let promise = new Promise((resolve, reject) => reject(error));
268268
```
269269
270-
In practice, this method is almost never used.
270+
En pratique, cette méthode n'est presque jamais utilisée.
271271
272-
## Summary
272+
## Résumé
273273
274-
There are 5 static methods of `Promise` class:
274+
Il y a 5 méthodes statiques de la classe `Promise`:
275275
276-
1. `Promise.all(promises)` -- waits for all promises to resolve and returns an array of their results. If any of the given promises rejects, then it becomes the error of `Promise.all`, and all other results are ignored.
277-
2. `Promise.allSettled(promises)` (recently added method) -- waits for all promises to settle and returns their results as array of objects with:
278-
- `state`: `"fulfilled"` or `"rejected"`
279-
- `value` (if fulfilled) or `reason` (if rejected).
280-
3. `Promise.race(promises)` -- waits for the first promise to settle, and its result/error becomes the outcome.
281-
4. `Promise.resolve(value)` -- makes a resolved promise with the given value.
282-
5. `Promise.reject(error)` -- makes a rejected promise with the given error.
276+
1. `Promise.all(promises)` -- attend que toutes les promesses se résolvent et retourne un tableau de leurs résultats. Si l'une des promesses données est rejetée, alors elle devient l'erreur de `Promise.all`, et tous les autres résultats sont ignorés.
277+
2. `Promise.allSettled(promises)` (méthode récemment ajoutée) -- attend que toutes les promesses se règlent et retourne leurs résultats sous forme de tableau d'objets avec:
278+
- `state`: `"fulfilled"` ou `"rejected"`
279+
- `value` (si rempli) ou `reason` (en cas de rejet).
280+
3. `Promise.race(promises)` -- attend que la première promesse soit réglée, et son résultat/erreur devient le dénouement.
281+
4. `Promise.resolve(value)` -- fait une promesse résolue avec la valeur donnée.
282+
5. `Promise.reject(error)` -- fait une promesse rejetée avec l'erreur donnée.
283283
284-
Of these five, `Promise.all` is probably the most common in practice.
284+
De ces cinq, " Promise.all " est probablement le plus courant en pratique.

0 commit comments

Comments
 (0)