2. Javascript ES2015 (6) - 프로미스 [1/5]

 

 

 

 

 

당연한 이야기이지만, Javascript와 Node에서는 비동기를 주로 사용하게 되고, 이벤트 리스너에서 콜백 함수에 대한 정의를 자주 쓰게 됩니다. 그러나, 이 콜백 함수들의 사용은 꽤나 코드를 복잡하게 만드는 원인이 되기도 합니다. ES2015부터는 이러한 API에서의 콜백 사용이 프로미스(Promise)를 기반으로 변경되어 복잡한 콜백 문법을 간소화시키고 있습니다. 

 

ES2015부터 사용되는 이 프로미스는 특히 노드 학습에 있어서 중요한 부분을 차지하니, 잘 공부하시기 바랍니다. 

 

 

 

---

 

 

프로미스 객체를 통한 실행 과정을 간단하게 요약해 보겠습니다. 

 

· new Promise 인스턴스를 선언합니다. 이 때, new Promise 파라미터에는 'resolve'와 'reject'를 파라미터로 갖는 콜백 함수를 전달합니다. 

· new Promise로 만든 변수에 then, 또는 catch 혹은 finally 메서드를 붙여서 선언할 수 있습니다. 
  > 프로미스 내부에서 resolve가 호출되면 then이 실행됩니다.
  > 프로미스 내부에서 reject가 호출되면 catch가 실행됩니다. 
  > finally는 성공 혹은 실패 여부와 상관 없이 실행됩니다. 
  (이 부분은 실제 코드를 보시며 사용법을 익히세요)

· 위 과정에서 resolve와 reject에서 넣어준 인수는 각각 then, catch에서 파라미터로 전달받게 됩니다.

· new Promise 선언과 then 또는 catch 실행 사이에는 공백이 있습니다. new Promise 선언 이후에 다른 동작을 선언해도 무방합니다.

 

 

위 설명만으로는 잘 이해가 가지 않을 것입니다. 코드를 실제로 보기 전에 흐름을 먼저 익히기 위한 설명이었으니, 예제를 통해 실제 프로미스 사용법을 확인해 보도록 하겠습니다. 

 

 

const condition = true; 
// true면 resolve, false면 reject

const promise = new Promise(
    (resolve, reject) => {
        if(condition){
            resolve('SUCCESS parameter');
        } else {
            reject('FAILED parameter');
        }
    });

    /*
    
    기타 다른 동작들을 선언 가능한 영역

    */

    promise
        .then(
            (message) => {
                // 성공(resolve) 실행
                console.log(message);
        })
        .catch(
            (error) => {
                // 실패(reject) 실행
                console.error(error);
        })
        .finally(
            () => {
                // 무조건 실행
                console.log('UNCONDITIONALLY');
        });


/* 출력
SUCCESS parameter
UNCONDITIONALLY
*/

 

 

resolve와 reject를 선언하고, 여기서 사용된 인자 값을 promise.then과 catch에서 사용하는 예시를 살펴보았습니다. 위 기본 동작을 베이스로 기능이 응용되고 다음 아티클까지 연결되니 해당 기본 양식을 충분히 반복해서 이해하도록 합시다.