jeena/en.javascript.info
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

images to svg

Browse source
This commit is contained in:
Ilya Kantor 2019-07-28 15:42:37 +03:00
parent a31e881856
commit 3ba28aa104
734 changed files with 11682 additions and 245 deletions
Download patch file Download diff file Expand all files Collapse all files

6
1-js/11-async/03-promise-chaining/article.md
View file

@ -42,7 +42,7 @@ Here the flow is:
As the result is passed along the chain of handlers, we can see a sequence of `alert` calls: `1` -> `2` -> `4`.
![](promise-then-chain.png)
![](promise-then-chain.svg)
The whole thing works, because a call to `promise.then` returns a promise, so that we can call the next `.then` on it.
@ -94,7 +94,7 @@ What we did here is just several handlers to one promise. They don't pass the re
Here's the picture (compare it with the chaining above):
![](promise-then-many.png)
![](promise-then-many.svg)
All `.then` on the same promise get the same result -- the result of that promise. So in the code above all `alert` show the same: `1`.
@ -382,4 +382,4 @@ If a `.then` (or `catch/finally`, doesn't matter) handler returns a promise, the
Here's a full picture:
![](promise-handler-variants.png)
![](promise-handler-variants.svg)

BIN
1-js/11-async/03-promise-chaining/promise-handler-variants.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 40 KiB

58
1-js/11-async/03-promise-chaining/promise-handler-variants.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 15 KiB

BIN
1-js/11-async/03-promise-chaining/promise-handler-variants@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 94 KiB

BIN
1-js/11-async/03-promise-chaining/promise-then-chain.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 9.2 KiB

38
1-js/11-async/03-promise-chaining/promise-then-chain.svg Normal file
View file

@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="165px" height="339px" viewBox="0 0 165 339" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>promise-then-chain.svg</title>
<desc>Created with sketchtool.</desc>
<g id="promise" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="promise-then-chain.svg">
<rect id="Rectangle-1-Copy-3" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="40" y="105" width="108" height="28"></rect>
<text id=".then" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" line-spacing="20" fill="#8A704D">
<tspan x="72.5" y="124">.then</tspan>
</text>
<rect id="Rectangle-1-Copy-8" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="40" y="10" width="108" height="28"></rect>
<text id="new-Promise" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" line-spacing="20" fill="#8A704D">
<tspan x="47.3" y="28">new Promise</tspan>
</text>
<text id="resolve(1)" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="7" y="70">resolve(1)</tspan>
</text>
<text id="return-2" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="14" y="167">return 2</tspan>
</text>
<path id="Line-Copy-8" d="M92.5,173.5 L92.5,142.5 L94.5,142.5 L94.5,173.5 L100.5,173.5 L93.5,187.5 L86.5,173.5 L92.5,173.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<rect id="Rectangle-1-Copy-4" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="40" y="202" width="108" height="28"></rect>
<text id=".then-copy" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" line-spacing="20" fill="#8A704D">
<tspan x="72.5" y="221">.then</tspan>
</text>
<text id="return-4" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="14" y="264">return 4</tspan>
</text>
<path id="Line-Copy-10" d="M92.5,271.5 L92.5,240.5 L94.5,240.5 L94.5,271.5 L100.5,271.5 L93.5,285.5 L86.5,271.5 L92.5,271.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<rect id="Rectangle-1-Copy-5" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="40" y="298" width="108" height="28"></rect>
<text id=".then-copy-2" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" line-spacing="20" fill="#8A704D">
<tspan x="72.5" y="317">.then</tspan>
</text>
<path id="Line-Copy-9" d="M92.5,77.5 L92.5,46.5 L94.5,46.5 L94.5,77.5 L100.5,77.5 L93.5,91.5 L86.5,77.5 L92.5,77.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3 KiB

BIN
1-js/11-async/03-promise-chaining/promise-then-chain@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 21 KiB

BIN
1-js/11-async/03-promise-chaining/promise-then-many.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 6.9 KiB

32
1-js/11-async/03-promise-chaining/promise-then-many.svg Normal file
View file

@ -0,0 +1,32 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="373px" height="152px" viewBox="0 0 373 152" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>promise-then-many.svg</title>
<desc>Created with sketchtool.</desc>
<g id="promise" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="promise-then-many.svg">
<rect id="Rectangle-1-Copy-3" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="120" width="108" height="28"></rect>
<text id=".then" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" line-spacing="20" fill="#8A704D">
<tspan x="42.5" y="139">.then</tspan>
</text>
<rect id="Rectangle-1-Copy-8" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="131" y="4" width="108" height="28"></rect>
<text id="new-Promise" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" line-spacing="20" fill="#8A704D">
<tspan x="138.3" y="22">new Promise</tspan>
</text>
<text id="resolve(1)" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="142" y="54">resolve(1)</tspan>
</text>
<path id="Line-Copy-8" d="M184,93 L184,71 L186,71 L186,93 L192,93 L185,107 L178,93 L184,93 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<rect id="Rectangle-1-Copy-4" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="131" y="120" width="108" height="28"></rect>
<text id=".then-copy" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" line-spacing="20" fill="#8A704D">
<tspan x="164" y="139">.then</tspan>
</text>
<path id="Line-Copy-9" d="M74.3957845,97.6522953 L113.74577,70.1073057 L114.892694,71.7457696 L75.5427092,99.2907591 L78.9834833,104.206151 L63.5,106.5 L70.9550105,92.7369037 L74.3957845,97.6522953 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<rect id="Rectangle-1-Copy-5" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="255" y="120" width="108" height="28"></rect>
<text id=".then-copy-2" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" line-spacing="20" fill="#8A704D">
<tspan x="287.5" y="139">.then</tspan>
</text>
<path id="Line-Copy-10" d="M293.891997,98.6098627 L256.595473,69.1652385 L257.834762,67.5954729 L295.131286,97.0400972 L298.849151,92.3308006 L305.5,106.5 L290.174131,103.319159 L293.891997,98.6098627 Z" fill="#EE6B47" fill-rule="nonzero"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
1-js/11-async/03-promise-chaining/promise-then-many@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 16 KiB