You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: 1-js/11-async/08-async-await/article.md
-32Lines changed: 0 additions & 32 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -69,17 +69,10 @@ f();
69
69
70
70
`await`는 말 그대로 프라미스가 처리될 때까지 함수 실행을 기다리게 만듭니다. 프라미스가 처리되면 그 결과와 함께 실행이 재개되죠. 프라미스가 처리되길 기다리는 동안엔 엔진이 다른 일(다른 스크립트를 실행, 이벤트 처리 등)을 할 수 있기 때문에, CPU 리소스가 낭비되지 않습니다.
71
71
72
-
<<<<<<< HEAD
73
72
`await`는 `promise.then`보다 좀 더 세련되게 프라미스의 `result` 값을 얻을 수 있도록 해주는 문법입니다. `promise.then`보다 가독성 좋고 쓰기도 쉽습니다.
74
73
75
74
````warn header="일반 함수엔 `await`을 사용할 수 없습니다."
76
75
`async` 함수가 아닌데 `await`을 사용하면 문법 에러가 발생합니다.
77
-
=======
78
-
It's just a more elegant syntax of getting the promise result than `promise.then`. And, it's easier to read and write.
79
-
80
-
````warn header="Can't use `await` in regular functions"
81
-
If we try to use `await` in a non-async function, there would be a syntax error:
82
-
>>>>>>> upstream/master
83
76
84
77
```js run
85
78
functionf() {
@@ -90,11 +83,7 @@ function f() {
90
83
}
91
84
```
92
85
93
-
<<<<<<< HEAD
94
86
function 앞에 `async`를 붙이지 않으면 이런 에러가 발생할 수 있습니다. 앞서 설명해 드린 바와 같이 `await`는 `async` 함수 안에서만 동작합니다.
95
-
=======
96
-
We may get this error if we forget to put `async` before a function. As stated earlier, `await` only works inside an `async` function.
97
-
>>>>>>> upstream/master
98
87
````
99
88
100
89
<info:promise-chaining> 챕터의 `showAvatar()` 예시를 `async/await`를 사용해 다시 작성해봅시다.
@@ -132,34 +121,18 @@ showAvatar();
132
121
133
122
코드가 깔끔해지고 읽기도 쉬워졌습니다. 프라미스를 사용한 것보다 훨씬 낫네요.
134
123
135
-
<<<<<<< HEAD
136
124
````smart header="`await`는 최상위 레벨 코드에서 작동하지 않습니다."
137
125
`await`을 이제 막 사용하기 시작한 분들은 최상위 레벨 코드(top-level code)에 `await`을 사용할 수 없다는 사실을 잊곤 합니다. 아래와 같은 코드는 동작하지 않습니다.
138
126
139
127
```js run
140
128
// 최상위 레벨 코드에선 문법 에러가 발생함
141
-
=======
142
-
````smart header="Modern browsers allow top-level `await` in modules"
143
-
In modern browsers, `await` on top level works just fine, when we're inside a module. We'll cover modules in article <info:modules-intro>.
144
-
145
-
For instance:
146
-
147
-
```js run module
148
-
// we assume this code runs at top level, inside a module
149
-
>>>>>>> upstream/master
150
129
let response = await fetch('/article/promise-chaining/user.json');
151
130
let user = await response.json();
152
131
153
132
console.log(user);
154
133
```
155
134
156
-
<<<<<<< HEAD
157
135
하지만 익명 async 함수로 코드를 감싸면 최상위 레벨 코드에도 `await`를 사용할 수 있습니다.
158
-
=======
159
-
If we're not using modules, or [older browsers](https://caniuse.com/mdn-javascript_operators_await_top_level) must be supported, there's a universal recipe: wrapping into an anonymous async function.
160
-
161
-
Like this:
162
-
>>>>>>> upstream/master
163
136
164
137
```js
165
138
(async () => {
@@ -325,13 +298,8 @@ function 앞에 `async` 키워드를 추가하면 두 가지 효과가 있습니
325
298
326
299
프라미스 앞에 `await` 키워드를 붙이면 자바스크립트는 프라미스가 처리될 때까지 대기합니다. 처리가 완료되면 조건에 따라 아래와 같은 동작이 이어집니다.
327
300
328
-
<<<<<<< HEAD
329
301
1. 에러 발생 -- 예외가 생성됨(에러가 발생한 장소에서 `throw error`를 호출한 것과 동일함)
330
302
2. 에러 미발생 -- 프라미스 객체의 result 값을 반환
331
-
=======
332
-
1. If it's an error, an exception is generated — same as if `throw error` were called at that very place.
333
-
2. Otherwise, it returns the result.
334
-
>>>>>>> upstream/master
335
303
336
304
`async/await`를 함께 사용하면 읽고, 쓰기 쉬운 비동기 코드를 작성할 수 있습니다.
0 commit comments