[개념잡기] async / await

async / await ?

node.js 를 공부하면서 async / await 의 개념이 나와서 정리해보려고 한다.

javascript 를 하다보면 특정 동작을 해야할 때가 있다.

"무엇을 한 다음에"

어떠한 동작이 일어난 다음에 다음 동작을 실행시키고 싶을 때 우리는 callback 함수를 사용했다.

물론 callback 함수를 사용해도 동작을 하는데 큰 상관은 없지만

a(data, function a_done(res){
    b(data, function b_done(res){
        c(data, function c_done(res){
            d(data, function d_done(res){
                alert("done!");
            });
        });
    });
});

callback 의 무분별한 사용은 코드의 가독성을 떨어뜨린다.

이제 async 와 await에 대해 정리를 해보겠다. 만약 틀린 개념이 있거나 부족한 설명은 댓글로 남겨주세요...

 

이 함수가 끝날때 까지 기다려라 "await"

간단한 예제를 들어 설명하겠다.

우선 db 로부터 값을 가져오는 getData()라는함수가 있다. 우리가 해야하는 동작은 getData() 로 받은 값중에 제일 첮번째 값을 리턴하는 함수를 짤려고 한다.

만약 기존 코드라면 이런식으로 값을 가져 와야 했을것이다.

function getFirstData(){
    return getData().then((res) => {
        return res[0].data;
    }).catch((err) => {
        return err;
    })
}

getData() 가 resolve (이행)하면 then() 을 이용하여 처리하고 만약 reject(실패)를 한다면 catch()를 통해 err를 처리한다.

 

이러한 코드를 async 와 await 를 이용하여 작성해 보았다.

async function getFirstData() {
    let data = await getData();
    return data[0].name;
}

함수 앞에 async를 붙히고 데이터를 가져오는 getData() 함수 앞에 await를 붙히면 getData()가 실행될때까지 기다린다.

이처럼 콜백을 사용해서 응답을 받던 코드를 한줄로 줄일 수 있다.

하지만 빼먹은 것이 한가지가 있다.

 

예외 처리

async await 에서 오류를 처리하는 방법은 흔히 알려진 try / catch 를 사용하면 된다.

위에 코드에 예외처리를 하면

async function getFirstData() {
    try {
        let data = await getData();
    	return data[0].name;
    } catch (e) {
        console.log(e);
    }
    
}

를 쓸 수 있다.

 

끝내면서

정리를 하면서도 개념이 너무 헷갈리고 어려웠다. 여러 블로그를 뒤져가면서 찾아보고 여러 예제들을 보는게 제일 좋은 방법같다. 그리고 기회가 된다면 koa.js 에 대해 공부해보고 싶다.