Skip to content

Commit ee1f353

Browse files
committed
async iterators generators: part 1
1 parent 5b7584d commit ee1f353

1 file changed

Lines changed: 43 additions & 42 deletions

File tree

  • 1-js/12-generators-iterators/2-async-iterators-generators

โ€Ž1-js/12-generators-iterators/2-async-iterators-generators/article.mdโ€Ž

Lines changed: 43 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,48 @@
11

2-
# Async iteration and generators
2+
# แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒ˜ แƒ˜แƒขแƒ”แƒ แƒแƒชแƒ˜แƒ แƒ“แƒ แƒ’แƒ”แƒœแƒ”แƒ แƒแƒขแƒแƒ แƒ”แƒ‘แƒ˜
33

4-
Asynchronous iteration allow us to iterate over data that comes asynchronously, on-demand. Like, for instance, when we download something chunk-by-chunk over a network. And asynchronous generators make it even more convenient.
4+
แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒ˜ แƒ˜แƒขแƒ”แƒ แƒแƒชแƒ˜แƒ แƒกแƒแƒจแƒฃแƒแƒšแƒ”แƒ‘แƒแƒก แƒ’แƒ•แƒแƒซแƒšแƒ”แƒ•แƒก แƒ’แƒแƒ“แƒแƒ•แƒฃแƒงแƒ•แƒ”แƒ— แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒแƒ“ แƒ›แƒ˜แƒฆแƒ”แƒ‘แƒฃแƒš แƒ›แƒแƒœแƒแƒชแƒ”แƒ›แƒก. แƒ›แƒแƒ’แƒแƒšแƒ˜แƒ—แƒแƒ“, แƒ แƒแƒ“แƒ”แƒกแƒแƒช แƒฅแƒกแƒ”แƒšแƒ˜แƒ“แƒแƒœ แƒœแƒแƒฌแƒ˜แƒš-แƒœแƒแƒฌแƒ˜แƒš แƒ•แƒ˜แƒฌแƒ”แƒ แƒ— แƒ แƒแƒ˜แƒ›แƒ”แƒก. แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒ˜ แƒ’แƒ”แƒœแƒ”แƒ แƒแƒขแƒแƒ แƒ”แƒ‘แƒ˜ แƒแƒ› แƒงแƒ•แƒ”แƒšแƒแƒคแƒ”แƒ แƒก แƒ˜แƒ›แƒžแƒšแƒ”แƒ›แƒ”แƒœแƒขแƒแƒชแƒ˜แƒแƒก แƒฃแƒคแƒ แƒ แƒ™แƒแƒ›แƒคแƒแƒ แƒขแƒฃแƒšแƒก แƒฎแƒ“แƒ˜แƒก.
55

6-
Let's see a simple example first, to grasp the syntax, and then review a real-life use case.
6+
แƒ›แƒแƒ“แƒ˜ แƒฏแƒ”แƒ  แƒ›แƒแƒ แƒขแƒ˜แƒ•แƒ˜ แƒ›แƒแƒ’แƒแƒšแƒ˜แƒ—แƒ˜ แƒ•แƒœแƒแƒฎแƒแƒ—, แƒ’แƒแƒ•แƒ˜แƒ’แƒแƒ— แƒกแƒ˜แƒœแƒขแƒแƒฅแƒกแƒ˜ แƒ แƒแƒ’แƒแƒ แƒ˜แƒ แƒ“แƒ แƒจแƒ”แƒ›แƒ“แƒ”แƒ’ แƒ แƒ”แƒแƒšแƒฃแƒ แƒ˜ แƒ›แƒแƒ’แƒแƒšแƒ˜แƒ—แƒ˜ แƒ’แƒแƒœแƒ•แƒ˜แƒฎแƒ˜แƒšแƒแƒ—.
77

8-
## Recall iterables
8+
## แƒ’แƒแƒ•แƒ˜แƒฎแƒกแƒ”แƒœแƒแƒ— แƒ˜แƒขแƒ”แƒ แƒแƒขแƒแƒ แƒ”แƒ‘แƒ˜
99

10-
Let's recall the topic about iterables.
10+
แƒ›แƒแƒ“แƒ˜ แƒ’แƒแƒ•แƒ˜แƒฎแƒกแƒ”แƒœแƒแƒ— แƒ˜แƒขแƒ”แƒ แƒแƒขแƒแƒ แƒ”แƒ‘แƒ˜แƒก แƒ—แƒแƒ•แƒ˜.
1111

12-
The idea is that we have an object, such as `range` here:
12+
แƒแƒœแƒฃ แƒ’แƒ•แƒแƒฅแƒ•แƒก แƒแƒ‘แƒ˜แƒ”แƒฅแƒขแƒ˜, แƒ แƒแƒ’แƒ˜แƒ แƒ˜แƒชแƒแƒ `range`:
1313
```js
1414
let range = {
1515
from: 1,
1616
to: 5
1717
};
1818
```
1919

20-
...And we'd like to use `for..of` loop on it, such as `for(value of range)`, to get values from `1` to `5`.
20+
...แƒ“แƒ แƒ’แƒ•แƒ˜แƒœแƒ“แƒ แƒ’แƒแƒ›แƒแƒ•แƒ˜แƒงแƒ”แƒœแƒแƒ— `for..of` แƒชแƒ˜แƒ™แƒšแƒ˜, แƒ แƒแƒ’แƒแƒ แƒ˜แƒชแƒแƒ `for(value of range)`, แƒ แƒแƒ› แƒ“แƒแƒ•แƒ˜แƒ—แƒ แƒ˜แƒแƒ— แƒ›แƒœแƒ˜แƒจแƒ•แƒœแƒ”แƒšแƒแƒ‘แƒ”แƒ‘แƒ˜ `1`-แƒ“แƒแƒœ `5`-แƒ›แƒ“แƒ”.
2121

22-
In other words, we want to add an *iteration ability* to the object.
22+
แƒกแƒฎแƒ•แƒ แƒกแƒ˜แƒขแƒงแƒ•แƒ”แƒ‘แƒ˜แƒ—, แƒฉแƒ•แƒ”แƒœ แƒ’แƒ•แƒ˜แƒœแƒ“แƒ *แƒ˜แƒขแƒ”แƒ แƒแƒชแƒ˜แƒ˜แƒก แƒฃแƒœแƒแƒ แƒ˜* แƒ“แƒแƒ•แƒฃแƒ›แƒแƒขแƒแƒ— แƒแƒ‘แƒ˜แƒ”แƒฅแƒขแƒก.
2323

24-
That can be implemented using a special method with the name `Symbol.iterator`:
24+
แƒแƒ›แƒ˜แƒก แƒ›แƒ˜แƒกแƒแƒฆแƒฌแƒ”แƒ•แƒแƒ“ แƒกแƒแƒญแƒ˜แƒ แƒแƒ แƒกแƒžแƒ”แƒชแƒ˜แƒแƒšแƒฃแƒ แƒ˜ แƒ›แƒ”แƒ—แƒแƒ“แƒ˜แƒก แƒ’แƒแƒ›แƒแƒงแƒ”แƒœแƒ”แƒ‘แƒ `Symbol.iterator`:
2525

26-
- This method is called in by the `for..of` construct when the loop is started, and it should return an object with the `next` method.
27-
- For each iteration, the `next()` method is invoked for the next value.
28-
- The `next()` should return a value in the form `{done: true/false, value:<loop value>}`, where `done:true` means the end of the loop.
26+
- แƒแƒ› แƒ›แƒ”แƒ—แƒแƒ“แƒก แƒ’แƒแƒ›แƒแƒ˜แƒซแƒแƒฎแƒ”แƒ‘แƒก `for..of` แƒชแƒ˜แƒ™แƒšแƒ˜แƒก แƒ“แƒแƒกแƒแƒฌแƒงแƒ˜แƒกแƒจแƒ˜ แƒ’แƒแƒ›แƒแƒ˜แƒซแƒแƒฎแƒ”แƒ‘แƒก, แƒ“แƒ แƒ›แƒแƒœ แƒฃแƒœแƒ“แƒ แƒ“แƒแƒแƒ‘แƒ แƒฃแƒœแƒแƒก แƒแƒ‘แƒ˜แƒ”แƒฅแƒขแƒ˜ `next` แƒ›แƒ”แƒ—แƒแƒ“แƒ˜แƒ—.
27+
- แƒงแƒแƒ•แƒ”แƒš แƒ˜แƒขแƒ”แƒ แƒแƒชแƒ˜แƒแƒ–แƒ”, `next()` แƒ›แƒ”แƒ—แƒแƒ“แƒ˜ แƒจแƒ”แƒ›แƒ“แƒ”แƒ’แƒ˜ แƒ›แƒœแƒ˜แƒจแƒ•แƒœแƒ”แƒšแƒแƒ‘แƒ˜แƒก แƒ›แƒ˜แƒกแƒแƒฆแƒ”แƒ‘แƒแƒ“ แƒ’แƒแƒ›แƒแƒ˜แƒซแƒแƒฎแƒ”แƒ‘แƒ.
28+
- `next()`-แƒ›แƒ“แƒ แƒฃแƒœแƒ“แƒ แƒ“แƒแƒแƒ‘แƒ แƒฃแƒœแƒแƒก แƒ›แƒœแƒ˜แƒจแƒ•แƒœแƒ”แƒšแƒแƒ‘แƒ แƒคแƒแƒ แƒ›แƒ˜แƒ— `{done: true/false, value:<แƒชแƒ˜แƒ™แƒšแƒ˜แƒก แƒ›แƒœแƒ˜แƒจแƒ•แƒœแƒ”แƒšแƒแƒ‘แƒ>}`, แƒกแƒแƒ“แƒแƒช `done:true` แƒชแƒ˜แƒ™แƒšแƒ˜แƒก แƒ“แƒแƒกแƒแƒกแƒ แƒฃแƒšแƒก แƒœแƒ˜แƒจแƒœแƒแƒ•แƒก.
2929

30-
Here's an implementation for the iterable `range`:
30+
แƒฅแƒ•แƒ”แƒ›แƒแƒ— แƒ›แƒแƒชแƒ”แƒ›แƒฃแƒšแƒ˜แƒ แƒ˜แƒขแƒ”แƒ แƒ˜แƒ แƒ”แƒ‘แƒแƒ“แƒ˜ `range`-แƒ˜แƒก แƒ˜แƒ›แƒžแƒšแƒ”แƒ›แƒ”แƒœแƒขแƒแƒชแƒ˜แƒ:
3131

3232
```js run
3333
let range = {
3434
from: 1,
3535
to: 5,
3636

3737
*!*
38-
[Symbol.iterator]() { // called once, in the beginning of for..of
38+
[Symbol.iterator]() { // แƒ’แƒแƒ›แƒแƒ˜แƒซแƒแƒฎแƒ”แƒ‘แƒ แƒ›แƒฎแƒแƒšแƒแƒ“ แƒ”แƒ แƒ—แƒฎแƒ”แƒš, for..of-แƒ˜แƒก แƒ“แƒแƒกแƒแƒฌแƒงแƒ˜แƒกแƒจแƒ˜
3939
*/!*
4040
return {
4141
current: this.from,
4242
last: this.to,
4343

4444
*!*
45-
next() { // called every iteration, to get the next value
45+
next() { // แƒ’แƒแƒ›แƒแƒ˜แƒซแƒแƒฎแƒ”แƒ‘แƒ แƒงแƒแƒ•แƒ”แƒš แƒ˜แƒขแƒ”แƒ แƒแƒชแƒ˜แƒแƒ–แƒ” แƒจแƒ”แƒ›แƒ“แƒ”แƒ’แƒ˜ แƒ›แƒœแƒ˜แƒจแƒ•แƒœแƒ”แƒšแƒแƒ‘แƒ˜แƒก แƒ“แƒแƒกแƒแƒ—แƒ แƒ”แƒ•แƒแƒ“
4646
*/!*
4747
if (this.current <= this.last) {
4848
return { done: false, value: this.current++ };
@@ -59,25 +59,25 @@ for(let value of range) {
5959
}
6060
```
6161

62-
If anything is unclear, please visit the chapter [](info:iterable), it gives all the details about regular iterables.
62+
แƒ—แƒฃ แƒ แƒแƒ›แƒ” แƒ’แƒแƒฃแƒ’แƒ”แƒ‘แƒแƒ แƒ˜แƒ, แƒ”แƒฌแƒ•แƒ˜แƒ”แƒ— แƒ—แƒแƒ•แƒก [แƒ˜แƒขแƒ”แƒ แƒแƒขแƒแƒ แƒ”แƒ‘แƒ˜](info:iterable), แƒฉแƒ•แƒ”แƒฃแƒšแƒ”แƒ‘แƒ แƒ˜แƒ• แƒ˜แƒขแƒ”แƒ แƒแƒขแƒแƒ แƒ”แƒ‘แƒ–แƒ” แƒ˜แƒœแƒคแƒแƒ แƒ›แƒแƒชแƒ˜แƒ˜แƒก แƒ›แƒ˜แƒกแƒแƒฆแƒ”แƒ‘แƒแƒ“.
6363

64-
## Async iterables
64+
## แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒ˜ แƒ˜แƒขแƒ”แƒ แƒแƒขแƒแƒ แƒ”แƒ‘แƒ˜
6565

66-
Asynchronous iteration is needed when values come asynchronously: after `setTimeout` or another kind of delay.
66+
แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒ˜ แƒ˜แƒขแƒ”แƒ แƒแƒชแƒ˜แƒ แƒกแƒแƒญแƒ˜แƒ แƒแƒ แƒ แƒแƒ“แƒ”แƒกแƒแƒช แƒ›แƒœแƒ˜แƒจแƒ•แƒœแƒ”แƒšแƒแƒ‘แƒ”แƒ‘แƒก แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒแƒ“ แƒ•แƒ˜แƒฆแƒ”แƒ‘แƒ—: `setTimeout`-แƒ˜แƒก แƒแƒœ แƒ›แƒแƒ’แƒ“แƒแƒ’แƒ•แƒแƒ แƒ˜ แƒจแƒ”แƒ›แƒคแƒ”แƒ แƒฎแƒ”แƒ‘แƒšแƒ˜แƒก แƒจแƒ”แƒ›แƒ“แƒ”แƒ’.
6767

68-
The most common case is that the object needs to make a network request to deliver the next value, we'll see a real-life example of it a bit later.
68+
แƒงแƒ•แƒ”แƒšแƒแƒ–แƒ” แƒฎแƒจแƒ˜แƒ แƒ˜ แƒจแƒ”แƒ›แƒ—แƒฎแƒ•แƒ”แƒ•แƒแƒ แƒ แƒแƒ“แƒ”แƒกแƒแƒช แƒแƒ‘แƒ˜แƒ”แƒฅแƒขแƒ˜ แƒฅแƒกแƒ”แƒšแƒก แƒ แƒ”แƒฅแƒฃแƒ”แƒกแƒ—แƒก แƒ’แƒแƒฃแƒ’แƒ–แƒแƒ•แƒœแƒ˜แƒก แƒ แƒแƒ› แƒจแƒ”แƒ›แƒ“แƒ”แƒ’แƒ˜ แƒ›แƒœแƒ˜แƒจแƒ•แƒœแƒ”แƒšแƒแƒ‘แƒ แƒ›แƒ˜แƒ˜แƒฆแƒแƒก, แƒชแƒแƒขแƒ แƒฎแƒแƒœแƒจแƒ˜ แƒ แƒ”แƒแƒšแƒฃแƒ  แƒ›แƒแƒ’แƒแƒšแƒ˜แƒ—แƒกแƒแƒช แƒ’แƒแƒœแƒ•แƒ˜แƒฎแƒ˜แƒšแƒแƒ•แƒ—.
6969

70-
To make an object iterable asynchronously:
70+
แƒ˜แƒ›แƒ˜แƒกแƒแƒ—แƒ•แƒ˜แƒก แƒ แƒแƒ› แƒแƒ‘แƒ˜แƒ”แƒฅแƒขแƒ˜ แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒแƒ“ แƒ˜แƒขแƒ”แƒ แƒ˜แƒ แƒ”แƒ‘แƒแƒ“แƒ˜ แƒ•แƒแƒฅแƒชแƒ˜แƒแƒ—, แƒฃแƒœแƒ“แƒ:
7171

72-
1. Use `Symbol.asyncIterator` instead of `Symbol.iterator`.
73-
2. The `next()` method should return a promise (to be fulfilled with the next value).
74-
- The `async` keyword handles it, we can simply make `async next()`.
75-
3. To iterate over such an object, we should use a `for await (let item of iterable)` loop.
76-
- Note the `await` word.
72+
1. แƒ’แƒแƒ›แƒแƒ•แƒ˜แƒงแƒ”แƒœแƒแƒ— `Symbol.asyncIterator` `Symbol.iterator`-แƒ˜แƒก แƒ›แƒแƒ’แƒ˜แƒ•แƒ แƒแƒ“.
73+
2. `next()` แƒ›แƒ”แƒ—แƒแƒ“แƒ›แƒ แƒฃแƒœแƒ“แƒ แƒ“แƒแƒแƒ‘แƒ แƒฃแƒœแƒแƒก "แƒ“แƒแƒžแƒ˜แƒ แƒ”แƒ‘แƒ" (promise, แƒ“แƒ แƒ›แƒ”แƒช "แƒคแƒ แƒแƒ›แƒ˜แƒกแƒก" แƒ’แƒแƒ›แƒแƒ•แƒ˜แƒงแƒ”แƒœแƒ”แƒ‘), แƒ แƒแƒ—แƒ แƒจแƒ”แƒ›แƒ“แƒ”แƒ’แƒ˜ แƒ›แƒœแƒ˜แƒจแƒ•แƒœแƒ”แƒšแƒแƒ‘แƒ˜แƒ— แƒจแƒ”แƒ˜แƒ•แƒกแƒแƒก.
74+
- `async` แƒฅแƒ˜แƒ•แƒแƒ แƒ“แƒ˜ แƒ›แƒ˜แƒฎแƒ”แƒ“แƒแƒ•แƒก แƒแƒ› แƒกแƒ˜แƒขแƒฃแƒแƒชแƒ˜แƒแƒก, แƒจแƒ”แƒ’แƒ•แƒ˜แƒซแƒšแƒ˜แƒ แƒžแƒ˜แƒ แƒ“แƒแƒžแƒ˜แƒ  `async next()` แƒ’แƒแƒ›แƒแƒ•แƒ˜แƒงแƒ”แƒœแƒแƒ—.
75+
3. แƒแƒกแƒ”แƒ— แƒแƒ‘แƒ˜แƒ”แƒฅแƒขแƒก แƒ แƒแƒ› แƒ’แƒแƒ“แƒแƒ•แƒฃแƒงแƒ•แƒ”แƒ—, แƒฃแƒœแƒ“แƒ แƒ’แƒแƒ›แƒแƒ•แƒ˜แƒงแƒ”แƒœแƒแƒ— `for await (let item of iterable)` แƒชแƒ˜แƒ™แƒšแƒ˜.
76+
- แƒงแƒฃแƒ แƒแƒ“แƒฆแƒ”แƒ‘แƒ แƒ›แƒ˜แƒแƒฅแƒชแƒ˜แƒ”แƒ— `await` แƒกแƒ˜แƒขแƒงแƒ•แƒแƒก.
7777

78-
As a starting example, let's make an iterable `range` object, similar like the one before, but now it will return values asynchronously, one per second.
78+
แƒ›แƒแƒ“แƒ˜ แƒ“แƒแƒกแƒแƒฌแƒงแƒ˜แƒกแƒ˜แƒกแƒ—แƒ•แƒ˜แƒก แƒจแƒ”แƒ•แƒฅแƒ›แƒœแƒแƒ— แƒฌแƒ˜แƒœแƒ `range`-แƒ˜แƒก แƒ›แƒแƒ’แƒ•แƒแƒ แƒ˜ แƒแƒ‘แƒ˜แƒ”แƒฅแƒขแƒ˜, แƒ›แƒแƒ’แƒ แƒแƒ› แƒแƒ›แƒฏแƒ”แƒ แƒแƒช แƒ˜แƒก แƒ“แƒแƒแƒ‘แƒ แƒฃแƒœแƒ”แƒ‘แƒขแƒก แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒš แƒ›แƒœแƒ˜แƒจแƒ•แƒœแƒ”แƒšแƒแƒ‘แƒ”แƒ‘แƒก แƒงแƒแƒ•แƒ”แƒš แƒ”แƒ แƒ— แƒฌแƒแƒ›แƒจแƒ˜.
7979

80-
All we need to do is to perform a few replacements in the code above:
80+
แƒ›แƒฎแƒแƒšแƒ แƒ แƒแƒ›แƒ“แƒ”แƒœแƒ˜แƒ›แƒ” แƒชแƒ•แƒšแƒ˜แƒšแƒ”แƒ‘แƒ˜แƒก แƒจแƒ”แƒขแƒแƒœแƒ แƒ›แƒแƒ’แƒ•แƒ˜แƒฌแƒ”แƒ•แƒก.
8181

8282
```js run
8383
let range = {
@@ -96,7 +96,7 @@ let range = {
9696
*/!*
9797

9898
*!*
99-
// note: we can use "await" inside the async next:
99+
// แƒ“แƒแƒแƒ™แƒ•แƒ˜แƒ แƒ“แƒ˜แƒ—, แƒฉแƒ•แƒ”แƒœ แƒจแƒ”แƒ’แƒ•แƒ˜แƒซแƒšแƒ˜แƒ "await" แƒ’แƒแƒ›แƒแƒ•แƒ˜แƒงแƒ”แƒœแƒแƒ— async next-แƒจแƒ˜:
100100
await new Promise(resolve => setTimeout(resolve, 1000)); // (3)
101101
*/!*
102102

@@ -121,32 +121,33 @@ let range = {
121121
})()
122122
```
123123

124-
As we can see, the structure is similar to regular iterators:
124+
แƒ แƒแƒ’แƒแƒ แƒชแƒ” แƒฎแƒ”แƒ“แƒแƒ•แƒ—, แƒ˜แƒ’แƒ˜แƒ•แƒ” แƒกแƒขแƒ แƒฃแƒฅแƒขแƒฃแƒ แƒ แƒแƒฅแƒ•แƒก แƒ แƒแƒ’แƒแƒ แƒช แƒฉแƒ•แƒ”แƒฃแƒšแƒ”แƒ‘แƒ แƒ˜แƒ• แƒ˜แƒขแƒ”แƒ แƒแƒขแƒแƒ แƒก:
125125

126-
1. To make an object asynchronously iterable, it must have a method `Symbol.asyncIterator` `(1)`.
127-
2. This method must return the object with `next()` method returning a promise `(2)`.
128-
3. The `next()` method doesn't have to be `async`, it may be a regular method returning a promise, but `async` allows us to use `await`, so that's convenient. Here we just delay for a second `(3)`.
129-
4. To iterate, we use `for await(let value of range)` `(4)`, namely add "await" after "for". It calls `range[Symbol.asyncIterator]()` once, and then its `next()` for values.
126+
1. แƒ˜แƒ›แƒ˜แƒกแƒแƒ—แƒ•แƒ˜แƒก แƒ แƒแƒ› แƒแƒ‘แƒ˜แƒ”แƒฅแƒขแƒ˜ แƒ’แƒแƒ•แƒฎแƒแƒ“แƒแƒ— แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒแƒ“ แƒ˜แƒขแƒ”แƒ แƒ˜แƒ แƒ”แƒ‘แƒแƒ“แƒ˜, แƒ›แƒแƒก แƒฃแƒœแƒ“แƒ แƒฐแƒฅแƒแƒœแƒ“แƒ”แƒก แƒ›แƒ”แƒ—Oแƒ“แƒ˜ `Symbol.asyncIterator` `(1)`.
127+
2. แƒแƒ› แƒ›แƒ”แƒ—แƒแƒ“แƒ›แƒ แƒฃแƒœแƒ“แƒ แƒ“แƒแƒแƒ‘แƒ แƒฃแƒœแƒแƒก แƒแƒ‘แƒ˜แƒ”แƒฅแƒขแƒ˜ `async next()` แƒ›แƒ”แƒ—แƒแƒ“แƒ˜แƒ— `(2)`.
128+
3. `next()` แƒ›แƒ”แƒ—แƒแƒ“แƒ˜ แƒแƒ แƒแƒ แƒกแƒแƒ•แƒแƒšแƒ“แƒ”แƒ‘แƒฃแƒšแƒ แƒ˜แƒงแƒแƒก `async`, แƒ˜แƒก แƒจแƒ”แƒ˜แƒซแƒšแƒ”แƒ‘แƒ แƒ˜แƒงแƒแƒก แƒฉแƒ•แƒ”แƒฃแƒšแƒ”แƒ‘แƒ แƒ˜แƒ•แƒ˜ แƒ›แƒ”แƒ—แƒแƒ“แƒ˜ แƒ แƒแƒ›แƒ”แƒšแƒ˜แƒช แƒแƒ‘แƒ แƒฃแƒœแƒ”แƒ‘แƒก แƒคแƒ แƒแƒ›แƒ˜แƒกแƒก, แƒ›แƒแƒ’แƒ แƒแƒ› `async` แƒกแƒแƒจแƒฃแƒแƒšแƒ”แƒ‘แƒแƒก แƒ’แƒ•แƒแƒซแƒšแƒ”แƒ•แƒก `await`-แƒ˜แƒก แƒ’แƒแƒ›แƒแƒงแƒ”แƒœแƒ”แƒ‘แƒแƒก แƒ“แƒ แƒแƒ›แƒ˜แƒขแƒแƒ› แƒฃแƒคแƒ แƒ แƒ™แƒแƒ›แƒคแƒแƒ แƒขแƒฃแƒšแƒ˜แƒ. `(3)` แƒแƒฅ แƒฉแƒ•แƒ”แƒœ แƒฃแƒ‘แƒ แƒแƒšแƒแƒ“ 1 แƒฌแƒแƒ›แƒ˜ แƒ•แƒแƒคแƒ”แƒ แƒฎแƒ”แƒ‘แƒ—.
129+
4. แƒ˜แƒขแƒ”แƒ แƒแƒชแƒ˜แƒ˜แƒก แƒฉแƒ•แƒ”แƒœ แƒ•แƒ˜แƒงแƒ”แƒœแƒ”แƒ‘แƒ— `for await (let value of range)` `(4)`, แƒแƒ  แƒ“แƒแƒ’แƒแƒ•แƒ˜แƒฌแƒงแƒ“แƒ”แƒ— "await"-แƒ˜แƒก แƒ“แƒแƒ›แƒแƒขแƒ”แƒ‘แƒ "for"-แƒ˜แƒก แƒจแƒ”แƒ›แƒ“แƒ”แƒ’. แƒ˜แƒก แƒ˜แƒซแƒแƒฎแƒ”แƒ‘แƒก `range[Symbol.asyncIterator]()`-แƒก แƒ”แƒ แƒ—แƒฎแƒ”แƒš, แƒ“แƒ แƒจแƒ”แƒ›แƒ“แƒ”แƒ’ `next()`-แƒก แƒ›แƒแƒ›แƒ“แƒ”แƒ•แƒœแƒ แƒ›แƒœแƒ˜แƒจแƒ•แƒœแƒ”แƒšแƒแƒ‘แƒ”แƒ‘แƒ˜แƒกแƒ—แƒ•แƒ˜แƒก.
130130

131-
Here's a small table with the differences:
131+
แƒฅแƒ•แƒ”แƒ›แƒแƒ— แƒชแƒฎแƒ แƒ˜แƒšแƒจแƒ˜ แƒ›แƒ˜แƒ—แƒ˜แƒ—แƒ”แƒ‘แƒฃแƒšแƒ˜แƒ แƒ’แƒแƒœแƒกแƒฎแƒ•แƒแƒ•แƒ”แƒ‘แƒ”แƒ‘แƒ˜:
132132

133-
| | Iterators | Async iterators |
133+
| | แƒ˜แƒขแƒ”แƒ แƒแƒขแƒแƒ แƒ”แƒ‘แƒ˜ | แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒ˜ แƒ˜แƒขแƒ”แƒ แƒแƒขแƒแƒ แƒ”แƒ‘แƒ˜ |
134134
|-------|-----------|-----------------|
135-
| Object method to provide iterator | `Symbol.iterator` | `Symbol.asyncIterator` |
136-
| `next()` return value is | any value | `Promise` |
137-
| to loop, use | `for..of` | `for await..of` |
135+
| แƒแƒ‘แƒ˜แƒ”แƒฅแƒขแƒ˜แƒก แƒ›แƒ”แƒ—แƒแƒ“แƒ˜ แƒ˜แƒขแƒ”แƒ แƒแƒชแƒ˜แƒ˜แƒก แƒ’แƒแƒ“แƒแƒกแƒแƒชแƒ”แƒ›แƒแƒ“ | `Symbol.iterator` | `Symbol.asyncIterator` |
136+
| `next()` แƒ แƒแƒกแƒแƒช แƒแƒ‘แƒ แƒฃแƒœแƒ”แƒ‘แƒก | any value | `Promise` |
137+
| แƒ˜แƒขแƒ”แƒ แƒแƒชแƒ˜แƒ˜แƒกแƒ—แƒ•แƒ˜แƒก แƒ’แƒแƒ›แƒแƒงแƒ”แƒœแƒ”แƒ‘แƒฃแƒšแƒ˜ แƒชแƒ˜แƒ™แƒšแƒ˜ | `for..of` | `for await..of` |
138138

139-
````warn header="The spread syntax `...` doesn't work asynchronously"
139+
````warn header="แƒ’แƒแƒจแƒšแƒ˜แƒก แƒแƒžแƒ”แƒ แƒแƒขแƒแƒ แƒก `...` แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒš แƒกแƒ˜แƒขแƒฃแƒแƒชแƒ˜แƒแƒจแƒ˜ แƒ•แƒ”แƒ  แƒ’แƒแƒ›แƒแƒ•แƒ˜แƒงแƒ”แƒœแƒ”แƒ‘แƒ—"
140140
Features that require regular, synchronous iterators, don't work with asynchronous ones.
141+
แƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒ˜ แƒ˜แƒขแƒ”แƒ แƒแƒขแƒแƒ แƒ”แƒ‘แƒ˜แƒก แƒ—แƒ•แƒ˜แƒกแƒ”แƒ‘แƒ”แƒ‘แƒก แƒแƒกแƒ˜แƒœแƒฅแƒ แƒแƒœแƒฃแƒšแƒ”แƒ‘แƒ—แƒแƒœ แƒ•แƒ”แƒ  แƒ’แƒแƒ›แƒแƒ•แƒ˜แƒงแƒ”แƒœแƒ”แƒ‘แƒ—.
141142

142-
For instance, a spread syntax won't work:
143+
แƒ›แƒแƒ’แƒแƒšแƒ˜แƒ—แƒแƒ“, แƒ’แƒแƒจแƒšแƒ˜ แƒแƒžแƒ”แƒ แƒแƒขแƒแƒ แƒ˜ แƒแƒ  แƒ˜แƒ›แƒฃแƒจแƒแƒ•แƒ”แƒ‘แƒก:
143144
```js
144145
alert( [...range] ); // Error, no Symbol.iterator
145146
```
146147

147-
That's natural, as it expects to find `Symbol.iterator`, not `Symbol.asyncIterator`.
148+
แƒแƒœแƒฃ แƒ‘แƒฃแƒœแƒ”แƒ‘แƒ แƒ˜แƒ•แƒ˜แƒ, แƒ แƒแƒ“แƒ’แƒแƒœ แƒ˜แƒก แƒชแƒ“แƒ˜แƒšแƒแƒ‘แƒก แƒ›แƒแƒซแƒ”แƒ‘แƒœแƒแƒก `Symbol.iterator` แƒ“แƒ แƒแƒ แƒ `Symbol.asyncIterator`.
148149

149-
It's also the case for `for..of`: the syntax without `await` needs `Symbol.iterator`.
150+
แƒ˜แƒ’แƒ˜แƒ•แƒ” แƒกแƒ˜แƒขแƒฃแƒแƒชแƒ˜แƒแƒ `for..of`-แƒ—แƒ•แƒ˜แƒก: `await`-แƒ˜แƒก แƒ’แƒแƒ แƒ”แƒจแƒ” แƒ›แƒฎแƒแƒšแƒแƒ“ `Symbol.iterator`-แƒ—แƒแƒœ แƒจแƒ”แƒ’แƒ•แƒ˜แƒซแƒšแƒ˜แƒ แƒ’แƒแƒ›แƒแƒ•แƒ˜แƒงแƒ”แƒœแƒแƒ—.
150151
````
151152
152153
## Recall generators

0 commit comments

Comments
ย (0)