|
1 | 1 |
|
2 | 2 | # Promises chaining
|
3 | 3 |
|
4 |
| -Let's return to the problem mentioned in the chapter <info:callbacks>: we have a sequence of asynchronous tasks to be done one after another. For instance, loading scripts. How can we code it well? |
| 4 | +Let's return to the problem mentioned in the chapter <info:callbacks>: we have a sequence of asynchronous tasks to be performed one after another — for instance, loading scripts. How can we code it well? |
5 | 5 |
|
6 | 6 | Promises provide a couple of recipes to do that.
|
7 | 7 |
|
@@ -164,7 +164,7 @@ loadScript("/article/promise-chaining/one.js")
|
164 | 164 |
|
165 | 165 | Here each `loadScript` call returns a promise, and the next `.then` runs when it resolves. Then it initiates the loading of the next script. So scripts are loaded one after another.
|
166 | 166 |
|
167 |
| -We can add more asynchronous actions to the chain. Please note that the code is still "flat", it grows down, not to the right. There are no signs of "pyramid of doom". |
| 167 | +We can add more asynchronous actions to the chain. Please note that the code is still "flat" — it grows down, not to the right. There are no signs of the "pyramid of doom". |
168 | 168 |
|
169 | 169 | Technically, we could add `.then` directly to each `loadScript`, like this:
|
170 | 170 |
|
@@ -287,7 +287,7 @@ fetch('/article/promise-chaining/user.json')
|
287 | 287 | });
|
288 | 288 | ```
|
289 | 289 |
|
290 |
| -The code works, see comments about the details. However, there's a potential problem in it, a typical error of those who begin to use promises. |
| 290 | +The code works; see comments about the details. However, there's a potential problem in it, a typical error for those who begin to use promises. |
291 | 291 |
|
292 | 292 | Look at the line `(*)`: how can we do something *after* the avatar has finished showing and gets removed? For instance, we'd like to show a form for editing that user or something else. As of now, there's no way.
|
293 | 293 |
|
@@ -319,13 +319,9 @@ fetch('/article/promise-chaining/user.json')
|
319 | 319 | .then(githubUser => alert(`Finished showing ${githubUser.name}`));
|
320 | 320 | ```
|
321 | 321 |
|
322 |
| -That is, `.then` handler in line `(*)` now returns `new Promise`, that becomes settled only after the call of `resolve(githubUser)` in `setTimeout` `(**)`. |
| 322 | +That is, the `.then` handler in line `(*)` now returns `new Promise`, that becomes settled only after the call of `resolve(githubUser)` in `setTimeout` `(**)`. The next `.then` in the chain will wait for that. |
323 | 323 |
|
324 |
| -The next `.then` in chain will wait for that. |
325 |
| - |
326 |
| -As a good practice, an asynchronous action should always return a promise. |
327 |
| - |
328 |
| -That makes it possible to plan actions after it. Even if we don't plan to extend the chain now, we may need it later. |
| 324 | +As a good practice, an asynchronous action should always return a promise. That makes it possible to plan actions after it; even if we don't plan to extend the chain now, we may need it later. |
329 | 325 |
|
330 | 326 | Finally, we can split the code into reusable functions:
|
331 | 327 |
|
|
0 commit comments