Async/await

Async

async keyword는 function 앞에 붙여서 사용한다.

async function f(){
	return 1;
}

이 행위의 의미는
'이 함수는 무적권 promise 객체를 return 할거야~' 라고 알려주는 것이다.

따라서 아래의 두 코드는 정확~하게 같은 의미다.

async function f() {
  return 1;
}

f().then(alert); // 1

아래 코드는 명시적으로 promise를 리턴한 것 뿐, 위와 같은 결과를 낸다.

async function f() {
  return Promise.resolve(1);
}

f().then(alert); // 1

따라서,
결론적으로 async는 non-promise들을 감싸서, promise를 확실하게 리턴하도록 만든다.

---

Await

참고 사이트

syntax와 정의 :

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

Await keyword는 promise가 settle 되어 result를 리턴시킬 때까지 자바스크립트를 멈춘다.

sample code

async function f() {

  let promise = new Promise((resolve, reject) => {
    setTimeout(() => resolve("done!"), 1000)
  });

  let result = await promise; // wait until the promise resolves (*)

  alert(result); // "done!"
}

f();

---

Error handling

try..catch구문을 이용해서 error를 핸들링한다.

async function f() {

  try {
    let response = await fetch('http://no-such-url');
  } catch(err) {
    alert(err); // TypeError: failed to fetch
  }
}

f();

async function f() {

  try {
    let response = await fetch('/no-user-here');
    let user = await response.json();
  } catch(err) {
    // catches errors both in fetch and response.json
    alert(err);
  }
}

f();

try..catch 없이 이런 식으로도 가능

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

// f() becomes a rejected promise
f().catch(alert); // TypeError: failed to fetch // (*)