async await(1)

async await는 앞에서 살펴본 promise를 좀더 가독성 좋게 만든 함수이다.

const workP = sec => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('workP function');
    }, sec * 1000);
  });
}

const asyncFunc = async () {
  const result_workP = await workP(3);
  console.log(result_workP);
  return 'async function';
}

asyncFunc().then((result) => {
  console.log(result)
});

//workP function
//async function

async await는 promise를 보완해서 만든 함수라서 반환값으로 promise와 똑같이 resolve, reject가 실행된 값으로 받게 된다.
위 코드를 살펴보면, workP콜백 함수는 이전 포스팅에서 선언한것과 같은 형태이고, 그다음 asyncFunc를 async await를 사용해서 선언했다.
그다음 asyncFunc를 호출해주고 있는 형태이다.
asyncFunc를 호출해서 asyncFunc함수를 보면 async를 통해 await를 사용했는데 await가 걸려있는 함수는 실행이 끝날때 까지 그 다음 코드가 실행되지 않게 하는 코드이다. 따라서 workP함수가 3초후에 실행이 되고 정상적으로 작동시 resolve가 'workP function'이라는 string을 가져오고 reswult_workP에 담는다. 이를 콘솔에 찍어내고, 'async function'이라는 string을 반환하게 되고, 이 string값이 .then(result)에 result에 담겨서 콘솔에 찍힌다.

await는 async만 있으면 쓸수 있고,

const result_workP1 = await workP(1);
const result_workP2 = await workP(1);

이런 식으로 연속해서 쓸수 있다. 때문에 async await또한 비동기 함수 작성시 좀더 가독성을 높이기 위해 나온 함수로 promise를 보완했다.
이는 es7.6문법부터 사용 가능하다고 한다.