Oct 28, 2019
diff --git a/1-js/11-async/08-async-await/article.md b/1-js/11-async/08-async-await/article.md
 # Async/await

 There's a special syntax to work with promises in a more comfortable fashion, called "async/await". It's surprisingly easy to understand and use.
 'async/await'은 프라미스를 좀 더 편하게 사용할 수 있는 특수한 문법입니다. 놀라울 정도로 쉽게 이해하고 사용할 수 있습니다.

 ##Async functions
 ##함수 Async

 Let's start with the`async`keyword. It can be placed before a function, like this:
 `async`키워드부터 시작해봅시다. 이 키워드는 아래처럼 함수 앞에 놓일 수 있습니다.

 ```js
 async function f() {
  return 1;
 }
 ```

 The word "async" before a function means one simple thing: a function always returns a promise. Other values are wrapped in a resolved promise automatically.
 함수 앞에 있는 'async'의 뜻은 간단합니다. 함수가 항상 프라미스를 반환한다는 말입니다. 다른 값들은 처리된 프라미스 안에 자동으로 감싸집니다.

 For instance, this function returns a resolved promise with the result of `1`, let's test it:
 예를 들어 이 함수는 `1`이라는 결과와 함께 처리된 프라미스를 반환합니다. 한 번 해보도록 하죠.

 ```js run
 async function f() {
 f().then(alert); // 1
 ```

 ...We could explicitly return a promise, that would be the same:
 ...직접적으로 명시해서 프라미스를 반환하는 방법도 있습니다. 위와 같은 의미입니다.

 ```js run
 async function f() {
 f().then(alert); // 1
 ```

 So, `async` ensures that the function returns a promise, and wraps non-promises in it. Simple enough, right? But not only that. There's another keyword,`await`, that works only inside `async` functions, and it's pretty cool.
 이렇게 `async`는 반드시 함수가 프라미스를 반환하도록 하며 프라미스가 아닌 것은 그 안에 감쌉니다. 굉장히 간단하죠? 이뿐만이 아니에요. 함수 `async` 안에서만 동작하는`await`이라는 또 다른 키워드가 있는데, 아주 멋진 녀석입니다.

 ## Await

 The syntax:
 문법은 이렇습니다.

 ```js
 // works only inside async functions
 let value = await promise;
 ```

 The keyword`await`makes JavaScript wait until that promise settles and returns its result.
 `await`키워드는 프라미스를 처리하고 결과를 반환할 때까지 자바스크립트를 지연시킵니다.

 Here's an example with a promise that resolves in 1 second:
 1초 후에 처리되는 프라미스 예제를 보시죠.
 ```js run
 async function f() {

  });

 *!*
  let result = await promise; //wait till the promise resolves (*)
  let result = await promise; //프라미스를 처리할 때까지 대기 (*)
 */!*

  alert(result); // "done!"
 f();
 ```

 The function execution "pauses" at the line`(*)`and resumes when the promise settles, with `result` becoming its result. So the code above shows "done!" in one second.
 `(*)`표시가 있는 줄에서 함수 실행이 '잠시 중단'되고 `result`가 그 결괏값이 되어 프라미스를 처리했을 때 다시 시작됩니다. 그래서 위의 코드가 1초 뒤에 "done!"을 출력하는 것이죠.

 Let's emphasize:`await` literally makes JavaScript wait until the promise settles, and then go on with the result. That doesn't cost any CPU resources, because the engine can do other jobs meanwhile: execute other scripts, handle events etc.
 다시 한번 강조할게요.`await`은 말 그대로 자바스크립트가 프라미스를 처리할 때까지 기다리게 하는 것입니다. 그리고 다시 결과를 이어나가죠. CPU 리소스는 전혀 사용하지 않습니다. 수행되는 동안 엔진이 다른 스크립트나 이벤트를 처리하는 등 남은 일을 할 수 있기 때문입니다.

 It's just a more elegant syntax of getting the promise result than`promise.then`, easier to read and write.
 프라미스 결과를 획득하는 데 있어서`promise.then`보다 세련된 방법이며 읽고 쓰기도 쉽습니다.

 ````warn header="Can't use `await` in regular functions"
 If we try to use`await` in non-async function, there would be a syntax error:
 ````warn header="일반 함수에는 `await`을 사용할 수 없습니다"
 async가 아닌 함수에`await`을 사용하려고 한다면 문법 에러가 나타날 겁니다.

 ```js run
 function f() {
 }
 ```

 We will get this error if we do not put`async` before a function. As said, `await` only works inside an`async function`.
 함수 앞에`async`를 넣지 않는다면 이런 에러가 발생할 겁니다. 말했던 것처럼 `await`은`async function`에서만 동작합니다.
 ````

 Let's take the `showAvatar()` example from the chapter<info:promise-chaining> and rewrite it using`async/await`:
 챕터<info:promise-chaining>의 `showAvatar()` 예제를 가져와`async/await`으로 다시 작성해보겠습니다.

 1.We'll need to replace`.then` calls with`await`.
 2.Also we should make the function`async` for them to work.
 1. `.then`을`await`으로 바꿔야 합니다.
 2.그러기 위해서는 함수에`async`를 붙여줘야 합니다.

 ```js run
 async function showAvatar() {

  //read our JSON
  //JSON 파일 읽어오기
  let response = await fetch('/article/promise-chaining/user.json');
  let user = await response.json();

  //readgithubuser
  // github사용자 읽어오기
  let githubResponse = await fetch(`https://api.github.com/users/${user.name}`);
  let githubUser = await githubResponse.json();

  //show the avatar
  //아바타 출력하기
  let img = document.createElement('img');
  img.src = githubUser.avatar_url;
  img.className = "promise-avatar-example";
  document.body.append(img);

  //wait 3 seconds
  //3초 대기
  await new Promise((resolve, reject) => setTimeout(resolve, 3000));

  img.remove();
 showAvatar();
 ```

 Pretty clean and easy to read, right? Much better than before.
 꽤 깔끔하고 읽기 쉬워졌죠? 이전보다 훨씬 나아졌어요.

 ````smart header="`await` won't work in the top-level code"
 People who are just starting to use`await` tend to forget the fact that we can't use`await` in top-level code. For example, this will not work:
 ````smart header="`await`는 최상위 코드에서 작동하지 않습니다"
 `await`을 이제 막 사용하기 시작한 분들은 최상위 코드에`await`을 사용하지 못한다는 걸 잊곤 합니다. 예를 들어 이런 코드는 작동하지 않습니다.

 ```js run
 //syntax error in top-level code
 //최상위 코드의 문법 에러
 let response = await fetch('/article/promise-chaining/user.json');
 let user = await response.json();
 ```

 We can wrap it into an anonymousasyncfunction, like this:
 이렇게 익명 함수async안으로 감쌀 수 있어요.

 ```js run
 (async () => {


 ````
 ````smart header="`await` accepts\"thenables\""
 Like`promise.then`, `await` allows to usethenableobjects (those with a callable`then`method).The idea is that a 3rd-party object may not be a promise, but promise-compatible: if it supports`.then`, that's enough to use with `await`.
 ````smart header="`await`은\"thenables\"를 받을 수 있습니다"
 `promise.then`처럼 `await`은thenable객체 사용을 허용합니다(호출할 수 있는`then`메서드가 있는 객체).서드파티 객체는 프라미스가 아닐지라도 프라미스와 호환이 가능합니다.`.then`을 지원한다면 `await`도 충분히 사용할 수 있습니다.

 Here's a demo`Thenable`class, the`await` below accepts its instances:
 여기 데모용`Thenable`클래스를 보면 아래의`await`이 그 인스턴스를 받고 있습니다.

 ```js run
 class Thenable {
  }
  then(resolve, reject) {
    alert(resolve);
    //resolve with this.num*2 after 1000ms
    //1000ms 후에 this.num*2를 처리
    setTimeout(() => resolve(this.num * 2), 1000); // (*)
  }
 };

 async function f() {
  //waits for 1 second, then result becomes 2
  //1초 대기 후 결괏값이 2가 됨
  let result = await new Thenable(1);
  alert(result);
 }

 f();
 ```

 If`await` gets a non-promise object with`.then`, it calls that method providing native functions`resolve`, `reject` as arguments. Then `await` waits until one of them is called (in the example above it happens in the line`(*)`) and then proceeds with the result.
 `await`이 프라미스가 아닌 객체를`.then`과 함께 받는다면`resolve`, `reject`를 네이티브 함수에 인수로 넘기면서 그 메서드를 호출합니다. 그러면 `await`은 그중 하나가 호출될 때까지 대기하고(예시에서`(*)` 표시가 있는 줄 참고) 결괏값이 나올 때까지 이어서 진행합니다.
 ````

 ````smart header="Asyncclass methods"
 To declare anasyncclass method, just prepend it with`async`:
 ````smart header="Async클래스 메서드"
 async클래스 메서드를 선언하고 싶다면 그냥`async`를 앞에 추가하세요.

 ```js run
 class Waiter {
  .wait()
  .then(alert); // 1
 ```
 The meaning is the same: it ensures that the returned value is a promise and enables `await`.
 의미는 같습니다. 반환된 값이 프라미스이며 `await`을 사용할 수 있다는 것이죠.

 ````
 ##Error handling
 ##에러 처리

 If a promise resolves normally, then`await promise` returns the result. But in case of a rejection, it throws the error, just as if there were a`throw` statement at that line.
 일반적으로 프라미스가 처리되면`await promise`가 결과를 반환합니다. 하지만 실패한다면 마치 그 줄에`throw`문이 있었던 것처럼 에러가 발생합니다.

 This code:
 이 코드를 보세요.

 ```js
 async function f() {
 }
 ```

 ...Is the same as this:
 ...이 코드는 아래와 동일합니다.

 ```js
 async function f() {
 }
 ```

 In real situations, the promise may take some time before it rejects. In that case there will be a delay before`await` throws an error.
 실제 상황에서 프라미스는 실패하기 전에 시간이 걸릴 수 있습니다. 이 경우엔`await`이 에러를 발생시키기 전에 시간이 지연될 거예요.

 We can catch that error using`try..catch`, the same way as a regular`throw`:
 이런 에러는`try..catch`를 사용해 해결할 수 있습니다. 일반적인`throw`와 같은 방법으로요.

 ```js run
 async function f() {
 f();
 ```

 In case of an error, the control jumps to the`catch`block. We can also wrap multiple lines:
 에러가 발생하면 제어부는`catch`블록으로 건너뜁니다. 이번에도 마찬가지로 여러 줄을 감쌀 수 있습니다.

 ```js run
 async function f() {
    let response = await fetch('/no-user-here');
    let user = await response.json();
  } catch(err) {
    //catches errors both in fetch and response.json
    //fetch와 response.json에서 발생한 에러 처리
    alert(err);
  }
 }

 f();
 ```

 If we don't have`try..catch`, then the promise generated by the call of theasyncfunction`f()` becomes rejected. We can append`.catch` to handle it:
 `try..catch`가 없다면 함수async `f()`를 호출하면서 만든 프라미스가 실패하게 됩니다. 이런 문제는`.catch`를 추가해서 해결할 수 있습니다.

 ```js run
 async function f() {
  let response = await fetch('http://no-such-url');
 }

 // f() becomes a rejected promise
 // f()는 실패한 프라미스가 됩니다.
 *!*
 f().catch(alert); // TypeError: failed to fetch // (*)
 */!*
 ```

 If we forget to add`.catch`there, then we get an unhandled promise error (viewable in the console).We can catch such errors using a global event handler as described in the chapter<info:promise-error-handling>.
 `.catch`추가를 잊어버렸을 경우 처리되지 않은 프라미스 에러를 받게 됩니다(콘솔에서 확인 가능).챕터<info:promise-error-handling>에 설명한 전역 이벤트 핸들러로 이러한 에러를 처리할 수 있습니다.


 ```smart header="`async/await` and `promise.then/catch`"
 When we use`async/await`, we rarely need `.then`, because `await` handles the waiting for us. And we can use a regular `try..catch` instead of `.catch`. That's usually (not always) more convenient.
 ```smart header="`async/await`와 `promise.then/catch`"
 `async/await`을 사용하면 `await`이 자바스크립트 지연을 담당하므로 `.then`이 거의 필요하지 않습니다. `.catch`를 대신해 일반적인 `try..catch`를 사용할 수도 있죠. 항상은 아니지만, 일반적으로는 이 방식이 더 편리합니다.

 But at the top level of the code, when we're outside of any`async`function, we're syntactically unable to use`await`, so it's a normal practice to add`.then/catch` to handle the final result or falling-through errors.
 하지만`async`함수 바깥쪽 코드 최상단에서는 문법적으로`await`을 사용할 수 없습니다. 그래서 최종 결과나 처리하지 못한 에러를 다루기 위해`.then/catch`를 추가하는 것이 일반적인 관행입니다.

 Like in the line`(*)` of the example above.
 위 예제에서`(*)`이 표시된 줄처럼요.
 ```

 ````smart header="`async/await` works well with`Promise.all`"
 When we need to wait for multiple promises, we can wrap them in`Promise.all`and then`await`:
 ````smart header="`async/await`는`Promise.all`과 잘 작동합니다"
 여러 개의 프라미스를 기다려야 할 때`Promise.all`안에 그 코드를 감싸서`await`을 사용할 수 있습니다.

 ```js
 //wait for the array of results
 //결괏값의 배열을 기다림
 let results = await Promise.all([
  fetch(url1),
  fetch(url2),
  ...
 ]);
 ```

 In case of an error, it propagates as usual: from the failed promise to`Promise.all`, and then becomes an exception that we can catch using`try..catch` around the call.
 에러가 발생하면 평소처럼 실패한 프라미스에서`Promise.all`로 전달됩니다. 그리고 호출된 곳 주변의`try..catch`를 이용해 예외를 처리하게 되죠.

 ````

 ##Summary
 ##요약

 The`async`keyword before a function has two effects:
 함수 앞에`async`키워드를 추가하면 두 가지 현상이 나타납니다.

 1.Makes it always return a promise.
 2.Allows to use`await` in it.
 1.언제나 프라미스를 반환하게 합니다.
 2.프라미스에`await`을 사용할 수 있습니다.

 The`await`keyword before a promise makes JavaScript wait until that promise settles, and then:
 프라미스 앞의`await`키워드는 프라미스를 처리할 때까지 자바스크립트를 지연시킵니다. 그러면 다음과 같이 되죠.

 1.If it's an error, the exception is generated, same as if`throw error` were called at that very place.
 2.Otherwise, it returns the result.
 1.에러가 난다면 바로 그 부분에서`throw error`를 호출한 것처럼 예외가 발생합니다.
 2.그렇지 않다면 결과를 반환합니다.

 Together they provide a great framework to write asynchronous code that is easy both to read and write.
 이 모든 것은 읽고 쓰기 쉬운 비동기 코드를 작성하기 위한 강력한 프레임워크를 제공합니다.

 With`async/await` we rarely need to write`promise.then/catch`, but we still shouldn't forget that they are based on promises, because sometimes (e.g. in the outermost scope) we have to use these methods. Also `Promise.all` is a nice thing to wait for many tasks simultaneously.
 `async/await`으로`promise.then/catch`를 거의 사용할 필요가 없지만, 여전히 이것이 프라미스를 기반으로 한다는 사실을 잊지 말아야 합니다. 가끔은 이런 메서드를 사용해야 할 때가 있거든요(예컨대 가장 바깥쪽 스코프). 또한 동시에 많은 작업을 기다려야 할 때는 `Promise.all`가 좋습니다.
Original file line number	Diff line number	Diff line change
		@@ -1,20 +1,20 @@
		# Async/await

		There's a special syntax to work with promises in a more comfortable fashion, called "async/await". It's surprisingly easy to understand and use.
		'async/await'은 프라미스를 좀 더 편하게 사용할 수 있는 특수한 문법입니다. 놀라울 정도로 쉽게 이해하고 사용할 수 있습니다.

		##Async functions
		##함수 Async

		Let's start with the`async`keyword. It can be placed before a function, like this:
		`async`키워드부터 시작해봅시다. 이 키워드는 아래처럼 함수 앞에 놓일 수 있습니다.

		```js
		async function f() {
		return 1;
		}
		```

		The word "async" before a function means one simple thing: a function always returns a promise. Other values are wrapped in a resolved promise automatically.
		함수 앞에 있는 'async'의 뜻은 간단합니다. 함수가 항상 프라미스를 반환한다는 말입니다. 다른 값들은 처리된 프라미스 안에 자동으로 감싸집니다.

		For instance, this function returns a resolved promise with the result of `1`, let's test it:
		예를 들어 이 함수는 `1`이라는 결과와 함께 처리된 프라미스를 반환합니다. 한 번 해보도록 하죠.

		```js run
		async function f() {
Expand All		@@ -24,7 +24,7 @@ async function f() {
		f().then(alert); // 1
		```

		...We could explicitly return a promise, that would be the same:
		...직접적으로 명시해서 프라미스를 반환하는 방법도 있습니다. 위와 같은 의미입니다.

		```js run
		async function f() {
Expand All		@@ -34,20 +34,20 @@ async function f() {
		f().then(alert); // 1
		```

		So, `async` ensures that the function returns a promise, and wraps non-promises in it. Simple enough, right? But not only that. There's another keyword,`await`, that works only inside `async` functions, and it's pretty cool.
		이렇게 `async`는 반드시 함수가 프라미스를 반환하도록 하며 프라미스가 아닌 것은 그 안에 감쌉니다. 굉장히 간단하죠? 이뿐만이 아니에요. 함수 `async` 안에서만 동작하는`await`이라는 또 다른 키워드가 있는데, 아주 멋진 녀석입니다.

		## Await

		The syntax:
		문법은 이렇습니다.

		```js
		// works only inside async functions
		let value = await promise;
		```

		The keyword`await`makes JavaScript wait until that promise settles and returns its result.
		`await`키워드는 프라미스를 처리하고 결과를 반환할 때까지 자바스크립트를 지연시킵니다.

		Here's an example with a promise that resolves in 1 second:
		1초 후에 처리되는 프라미스 예제를 보시죠.
		```js run
		async function f() {

Expand All		@@ -56,7 +56,7 @@ async function f() {
		});

		!
		let result = await promise; //wait till the promise resolves (*)
		let result = await promise; //프라미스를 처리할 때까지 대기 (*)
		/!

		alert(result); // "done!"
Expand All		@@ -65,14 +65,14 @@ async function f() {
		f();
		```

		The function execution "pauses" at the line`(*)`and resumes when the promise settles, with `result` becoming its result. So the code above shows "done!" in one second.
		`(*)`표시가 있는 줄에서 함수 실행이 '잠시 중단'되고 `result`가 그 결괏값이 되어 프라미스를 처리했을 때 다시 시작됩니다. 그래서 위의 코드가 1초 뒤에 "done!"을 출력하는 것이죠.

		Let's emphasize:`await` literally makes JavaScript wait until the promise settles, and then go on with the result. That doesn't cost any CPU resources, because the engine can do other jobs meanwhile: execute other scripts, handle events etc.
		다시 한번 강조할게요.`await`은 말 그대로 자바스크립트가 프라미스를 처리할 때까지 기다리게 하는 것입니다. 그리고 다시 결과를 이어나가죠. CPU 리소스는 전혀 사용하지 않습니다. 수행되는 동안 엔진이 다른 스크립트나 이벤트를 처리하는 등 남은 일을 할 수 있기 때문입니다.

		It's just a more elegant syntax of getting the promise result than`promise.then`, easier to read and write.
		프라미스 결과를 획득하는 데 있어서`promise.then`보다 세련된 방법이며 읽고 쓰기도 쉽습니다.

		````warn header="Can't use `await` in regular functions"
		If we try to use`await` in non-async function, there would be a syntax error:
		````warn header="일반 함수에는 `await`을 사용할 수 없습니다"
		async가 아닌 함수에`await`을 사용하려고 한다면 문법 에러가 나타날 겁니다.

		```js run
		function f() {
Expand All		@@ -83,32 +83,32 @@ function f() {
		}
		```

		We will get this error if we do not put`async` before a function. As said, `await` only works inside an`async function`.
		함수 앞에`async`를 넣지 않는다면 이런 에러가 발생할 겁니다. 말했던 것처럼 `await`은`async function`에서만 동작합니다.
		````

		Let's take the `showAvatar()` example from the chapter<info:promise-chaining> and rewrite it using`async/await`:
		챕터<info:promise-chaining>의 `showAvatar()` 예제를 가져와`async/await`으로 다시 작성해보겠습니다.

		1.We'll need to replace`.then` calls with`await`.
		2.Also we should make the function`async` for them to work.
		1. `.then`을`await`으로 바꿔야 합니다.
		2.그러기 위해서는 함수에`async`를 붙여줘야 합니다.

		```js run
		async function showAvatar() {

		//read our JSON
		//JSON 파일 읽어오기
		let response = await fetch('/article/promise-chaining/user.json');
		let user = await response.json();

		//readgithubuser
		// github사용자 읽어오기
		let githubResponse = await fetch(`https://api.github.com/users/${user.name}`);
		let githubUser = await githubResponse.json();

		//show the avatar
		//아바타 출력하기
		let img = document.createElement('img');
		img.src = githubUser.avatar_url;
		img.className = "promise-avatar-example";
		document.body.append(img);

		//wait 3 seconds
		//3초 대기
		await new Promise((resolve, reject) => setTimeout(resolve, 3000));

		img.remove();
Expand All		@@ -119,18 +119,18 @@ async function showAvatar() {
		showAvatar();
		```

		Pretty clean and easy to read, right? Much better than before.
		꽤 깔끔하고 읽기 쉬워졌죠? 이전보다 훨씬 나아졌어요.

		````smart header="`await` won't work in the top-level code"
		People who are just starting to use`await` tend to forget the fact that we can't use`await` in top-level code. For example, this will not work:
		````smart header="`await`는 최상위 코드에서 작동하지 않습니다"
		`await`을 이제 막 사용하기 시작한 분들은 최상위 코드에`await`을 사용하지 못한다는 걸 잊곤 합니다. 예를 들어 이런 코드는 작동하지 않습니다.

		```js run
		//syntax error in top-level code
		//최상위 코드의 문법 에러
		let response = await fetch('/article/promise-chaining/user.json');
		let user = await response.json();
		```

		We can wrap it into an anonymousasyncfunction, like this:
		이렇게 익명 함수async안으로 감쌀 수 있어요.

		```js run
		(async () => {
Expand All		@@ -142,10 +142,10 @@ We can wrap it into an anonymous async function, like this:


		````
		````smart header="`await` accepts\"thenables\""
		Like`promise.then`, `await` allows to usethenableobjects (those with a callable`then`method).The idea is that a 3rd-party object may not be a promise, but promise-compatible: if it supports`.then`, that's enough to use with `await`.
		````smart header="`await`은\"thenables\"를 받을 수 있습니다"
		`promise.then`처럼 `await`은thenable객체 사용을 허용합니다(호출할 수 있는`then`메서드가 있는 객체).서드파티 객체는 프라미스가 아닐지라도 프라미스와 호환이 가능합니다.`.then`을 지원한다면 `await`도 충분히 사용할 수 있습니다.

		Here's a demo`Thenable`class, the`await` below accepts its instances:
		여기 데모용`Thenable`클래스를 보면 아래의`await`이 그 인스턴스를 받고 있습니다.

		```js run
		class Thenable {
Expand All		@@ -154,25 +154,25 @@ class Thenable {
		}
		then(resolve, reject) {
		alert(resolve);
		//resolve with this.num*2 after 1000ms
		//1000ms 후에 this.num*2를 처리
		setTimeout(() => resolve(this.num * 2), 1000); // (*)
		}
		};

		async function f() {
		//waits for 1 second, then result becomes 2
		//1초 대기 후 결괏값이 2가 됨
		let result = await new Thenable(1);
		alert(result);
		}

		f();
		```

		If`await` gets a non-promise object with`.then`, it calls that method providing native functions`resolve`, `reject` as arguments. Then `await` waits until one of them is called (in the example above it happens in the line`(*)`) and then proceeds with the result.
		`await`이 프라미스가 아닌 객체를`.then`과 함께 받는다면`resolve`, `reject`를 네이티브 함수에 인수로 넘기면서 그 메서드를 호출합니다. 그러면 `await`은 그중 하나가 호출될 때까지 대기하고(예시에서`(*)` 표시가 있는 줄 참고) 결괏값이 나올 때까지 이어서 진행합니다.
		````

		````smart header="Asyncclass methods"
		To declare anasyncclass method, just prepend it with`async`:
		````smart header="Async클래스 메서드"
		async클래스 메서드를 선언하고 싶다면 그냥`async`를 앞에 추가하세요.

		```js run
		class Waiter {
Expand All		@@ -187,14 +187,14 @@ new Waiter()
		.wait()
		.then(alert); // 1
		```
		The meaning is the same: it ensures that the returned value is a promise and enables `await`.
		의미는 같습니다. 반환된 값이 프라미스이며 `await`을 사용할 수 있다는 것이죠.

		````
		##Error handling
		##에러 처리

		If a promise resolves normally, then`await promise` returns the result. But in case of a rejection, it throws the error, just as if there were a`throw` statement at that line.
		일반적으로 프라미스가 처리되면`await promise`가 결과를 반환합니다. 하지만 실패한다면 마치 그 줄에`throw`문이 있었던 것처럼 에러가 발생합니다.

		This code:
		이 코드를 보세요.

		```js
		async function f() {
Expand All		@@ -204,7 +204,7 @@ async function f() {
		}
		```

		...Is the same as this:
		...이 코드는 아래와 동일합니다.

		```js
		async function f() {
Expand All		@@ -214,9 +214,9 @@ async function f() {
		}
		```

		In real situations, the promise may take some time before it rejects. In that case there will be a delay before`await` throws an error.
		실제 상황에서 프라미스는 실패하기 전에 시간이 걸릴 수 있습니다. 이 경우엔`await`이 에러를 발생시키기 전에 시간이 지연될 거예요.

		We can catch that error using`try..catch`, the same way as a regular`throw`:
		이런 에러는`try..catch`를 사용해 해결할 수 있습니다. 일반적인`throw`와 같은 방법으로요.

		```js run
		async function f() {
Expand All		@@ -233,7 +233,7 @@ async function f() {
		f();
		```

		In case of an error, the control jumps to the`catch`block. We can also wrap multiple lines:
		에러가 발생하면 제어부는`catch`블록으로 건너뜁니다. 이번에도 마찬가지로 여러 줄을 감쌀 수 있습니다.

		```js run
		async function f() {
Expand All		@@ -242,66 +242,66 @@ async function f() {
		let response = await fetch('/no-user-here');
		let user = await response.json();
		} catch(err) {
		//catches errors both in fetch and response.json
		//fetch와 response.json에서 발생한 에러 처리
		alert(err);
		}
		}

		f();
		```

		If we don't have`try..catch`, then the promise generated by the call of theasyncfunction`f()` becomes rejected. We can append`.catch` to handle it:
		`try..catch`가 없다면 함수async `f()`를 호출하면서 만든 프라미스가 실패하게 됩니다. 이런 문제는`.catch`를 추가해서 해결할 수 있습니다.

		```js run
		async function f() {
		let response = await fetch('http://no-such-url');
		}

		// f() becomes a rejected promise
		// f()는 실패한 프라미스가 됩니다.
		!
		f().catch(alert); // TypeError: failed to fetch // (*)
		/!
		```

		If we forget to add`.catch`there, then we get an unhandled promise error (viewable in the console).We can catch such errors using a global event handler as described in the chapter<info:promise-error-handling>.
		`.catch`추가를 잊어버렸을 경우 처리되지 않은 프라미스 에러를 받게 됩니다(콘솔에서 확인 가능).챕터<info:promise-error-handling>에 설명한 전역 이벤트 핸들러로 이러한 에러를 처리할 수 있습니다.


		```smart header="`async/await` and `promise.then/catch`"
		When we use`async/await`, we rarely need `.then`, because `await` handles the waiting for us. And we can use a regular `try..catch` instead of `.catch`. That's usually (not always) more convenient.
		```smart header="`async/await`와 `promise.then/catch`"
		`async/await`을 사용하면 `await`이 자바스크립트 지연을 담당하므로 `.then`이 거의 필요하지 않습니다. `.catch`를 대신해 일반적인 `try..catch`를 사용할 수도 있죠. 항상은 아니지만, 일반적으로는 이 방식이 더 편리합니다.

		But at the top level of the code, when we're outside of any`async`function, we're syntactically unable to use`await`, so it's a normal practice to add`.then/catch` to handle the final result or falling-through errors.
		하지만`async`함수 바깥쪽 코드 최상단에서는 문법적으로`await`을 사용할 수 없습니다. 그래서 최종 결과나 처리하지 못한 에러를 다루기 위해`.then/catch`를 추가하는 것이 일반적인 관행입니다.

		Like in the line`(*)` of the example above.
		위 예제에서`(*)`이 표시된 줄처럼요.
		```

		````smart header="`async/await` works well with`Promise.all`"
		When we need to wait for multiple promises, we can wrap them in`Promise.all`and then`await`:
		````smart header="`async/await`는`Promise.all`과 잘 작동합니다"
		여러 개의 프라미스를 기다려야 할 때`Promise.all`안에 그 코드를 감싸서`await`을 사용할 수 있습니다.

		```js
		//wait for the array of results
		//결괏값의 배열을 기다림
		let results = await Promise.all([
		fetch(url1),
		fetch(url2),
		...
		]);
		```

		In case of an error, it propagates as usual: from the failed promise to`Promise.all`, and then becomes an exception that we can catch using`try..catch` around the call.
		에러가 발생하면 평소처럼 실패한 프라미스에서`Promise.all`로 전달됩니다. 그리고 호출된 곳 주변의`try..catch`를 이용해 예외를 처리하게 되죠.

		````

		##Summary
		##요약

		The`async`keyword before a function has two effects:
		함수 앞에`async`키워드를 추가하면 두 가지 현상이 나타납니다.

		1.Makes it always return a promise.
		2.Allows to use`await` in it.
		1.언제나 프라미스를 반환하게 합니다.
		2.프라미스에`await`을 사용할 수 있습니다.

		The`await`keyword before a promise makes JavaScript wait until that promise settles, and then:
		프라미스 앞의`await`키워드는 프라미스를 처리할 때까지 자바스크립트를 지연시킵니다. 그러면 다음과 같이 되죠.

		1.If it's an error, the exception is generated, same as if`throw error` were called at that very place.
		2.Otherwise, it returns the result.
		1.에러가 난다면 바로 그 부분에서`throw error`를 호출한 것처럼 예외가 발생합니다.
		2.그렇지 않다면 결과를 반환합니다.

		Together they provide a great framework to write asynchronous code that is easy both to read and write.
		이 모든 것은 읽고 쓰기 쉬운 비동기 코드를 작성하기 위한 강력한 프레임워크를 제공합니다.

		With`async/await` we rarely need to write`promise.then/catch`, but we still shouldn't forget that they are based on promises, because sometimes (e.g. in the outermost scope) we have to use these methods. Also `Promise.all` is a nice thing to wait for many tasks simultaneously.
		`async/await`으로`promise.then/catch`를 거의 사용할 필요가 없지만, 여전히 이것이 프라미스를 기반으로 한다는 사실을 잊지 말아야 합니다. 가끔은 이런 메서드를 사용해야 할 때가 있거든요(예컨대 가장 바깥쪽 스코프). 또한 동시에 많은 작업을 기다려야 할 때는 `Promise.all`가 좋습니다.