Promise의 문제점

Promise는 콜백지옥을 탈출할 정말 효과적이고 좋은 방식이다. 하지만 promis의 .then()을 여러번 사용한다면 ?? 콜백지옥에서 .then() 지옥이 시작되는거 아닐까?? 사실 .then()을 써봤자 얼마나 쓴다고 async await 가 나왔을까? 물론 많이 쓰면 코드가 난잡해지고 가독성 측면에서 안 좋아질 수는 있겠다.

여튼 async await 는 프로미스를 정말 간결하고 편하게 사용할 수 있는 문법이다. ! Syntactic Sugar 라고도 한다.

Syntactic Sugar : 문법적인 설탕(?) -> 문법적인 기능은 그대로인데 읽는 사람이 더 간결하게 직관적으로 코드를 읽을 수 있게 도와준다 라는 뜻이다.

async function f() {
  return 1;
}

function 앞에 async를 붙이면 해당 함수는 항상 promise를 반환한다.

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

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

명시적으로 promise를 반환하는 것과 같으며 결과는 동일하다.

await

• async함수 안에서만 동작한다.
• await는 정말 정말 편리하고 코드를 멋지게 만들어준다.
• 주의할 점은 비동기 처리 메서드가 꼭 promise 객체를 반환해야만 await가 의도한 대로 동작한다.
• async, await 는 주로 서버에서 데이터를 받아오고 통신하는데에 많이 쓰인다. (이유는 비동기적으로 실행되기 때문)
• 말 그대로 promise가 처리될 때까지 함수 실행을 기다린다. 처리되면 그 결과와 함께 실행이 재개된다. (처리되길 기다리는 동안 엔진이 다른 일을 할 수 있기 대문에 리소스또한 낭비되지 않는다.)

async await 예시

아래에 코드는 async, await 가 쓰인 코드다. NodeJS에서 express로 서버를 열고 DB와 통신을 할 때 내가 작성했던 코드이다 .async await는 이 코드 하나로 다 설명이 가능하다.

const getAllArticles = async (req, res) => {
  try {
    const client = await mongoClient.connect();
    const board = client.db('kdt5').collection('board');
    const ARTICLE = await board.find({}).toArray();
    res.render('db_board', {
      ARTICLE,
      articleCounts: ARTICLE.length,
      userId: req.session.userId,
    });
  } catch (err) {
    console.error(err);
    res.status(500).send(err.message + UNEXPECTED_MSG);
  }
};

• 게시판 서비스인데, 작성한 글을 서버에서 데이터를 받아와서 불러오고 있다.
• 비동기적으로 작동하기 때문에 async 예약어를 붙여준다.
• 예외처리를 하기위해 try catch 구문을 사용해준다.
• promise에서 에러 처리를 위해 .catch()를 사용했던 것처럼 async에서는 catch{}를 사용하면 된다.
• mongoDB에 접속, 원하는 데이터를 찾는 코드가 비동기적으로 작동하기 때문에 await를 붙여준다.
• 에러가 발생하면 에러를 던져주는 catch {}가 있다.
• 발견된 에러는 error 객체에 담기기 때문에 에러의 유형에 맞게 에러 코드를 처리해줄수 있다. 또한 에러 발생 시 에러를 던져주기 때문에 서버가 꺼지지 않는다.