Skip to content

Commit e8db0f9

Browse files
committed
up
1 parent 75895f4 commit e8db0f9

File tree

6 files changed

+11
-9
lines changed

6 files changed

+11
-9
lines changed

8-async/03-promise-chaining/article.md

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ As we can see:
4343

4444
So in the example above we have a sequence of results: `1` -> `2` -> `4`.
4545

46-
Please note the difference between chained `.then` and many `.then` on a single promise, like below:
46+
Please note the technically we can also add many `.then` to a single promise, without any chaining, like here:
4747

4848
```js run
4949
let promise = new Promise(function(resolve, reject) {
@@ -66,17 +66,19 @@ promise.then(function(result) {
6666
});
6767
```
6868

69-
In the code above, all `.then` are on the same promise, so all of them get the same result -- the result of that promise. And all `alert` show the same: 1.
69+
...But that's a totally different thing. All `.then` on the same promise get the same result -- the result of that promise:
7070

7171
![](promise-then-many.png)
7272

73-
If we want to use the value returned by a handler of `.then`, then we should add a new `.then` after it (to chain).
73+
So in the code above all `alert` show the same: 1.
74+
75+
In practice chaining is used far more often than adding many handlers to the same promise.
7476

7577
## Returning promises
7678

77-
Normally, the value returned by a handler is passed to the next `.then`. But there's an exception. If the returned value is a promise, then further execution is suspended till it settles. And then the result of that promise is used.
79+
Normally, a value returned by a handler is passed to the next `.then`. But there's an exception. If the returned value is a promise, then further execution is suspended till it settles. And then the result of that promise is given to the next `.then`.
7880

79-
Let's see it in action here:
81+
For instance:
8082

8183
```js run
8284
new Promise(function(resolve, reject) {
@@ -110,11 +112,11 @@ new Promise(function(resolve, reject) {
110112
});
111113
```
112114

113-
Now we have the same 1 -> 2 > 4 output, but with 1 second delay between each.
115+
Here each `.then` returns `new Promise(…)`. JavaScript awaits for it to settle and then passes on the result.
114116

115-
When we return `new Promise(…)`, the next `.then` in the chain is executed when it settles and gets its result.
117+
So the output is again 1 -> 2 > 4, but with 1 second delay between `alert` calls.
116118

117-
Let's use it with `loadScript` to load multiple scripts one by one, in sequence:
119+
Let's use it with `loadScript` to load scripts one by one, in sequence:
118120

119121
```js run
120122
loadScript("/article/promise-chaining/one.js")
@@ -132,7 +134,7 @@ loadScript("/article/promise-chaining/one.js")
132134
```
133135

134136

135-
The code totally evades the pyramid of doom. We can add more asynchronous actions to the chain, and the code is still "flat".
137+
We can add more asynchronous actions to the chain, and the code is still "flat", no "pyramid of doom".
136138

137139
## Error handling
138140

1.11 KB
Loading
2.46 KB
Loading
509 Bytes
Loading
1.17 KB
Loading

figures.sketch

-137 Bytes
Binary file not shown.

0 commit comments

Comments
 (0)