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

 

 

 

 

 

우리는 앞선 아티클에서, 프로미스를 생성해 then, catch, finally를 출력하는 과정을 살펴보았습니다. 그런데 여기서 드는 한 가지 의문, then이나 catch는 딱 '한 개만' 실행이 가능한 것일까요? 결론만 얘기하자면 그렇지 않습니다. 

 

then이나 catch 선언문에서 다시 다른 then이나 catch를 붙일 수 있습니다. 앞선 아티클에서 살펴본 코드를 살짝 수정해 보겠습니다. 

 

 

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

 

 

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) 실행 후 다음 then으로 리턴
                return new Promise((resolve, reject) => {
                    resolve(message);
                });
        })
        .then((message2) => {
            console.log("message2 : " + message2);
            return new Promise((resolve, reject) => {
                resolve(message2);
            });
        })
        .then((message3) => {
            console.log("message3 : " + message3);
        })
        .catch(
            (error) => {
                // 실패(reject) 실행
                console.error(error);
        })
        .finally(
            () => {
                // 무조건 실행
                console.log('UNCONDITIONALLY');
        });


/*
message2 : SUCCESS parameter
message3 : SUCCESS parameter
UNCONDITIONALLY
*/

 

 

첫 번째 then에서는 파라미터로 전달 받은 'SUCCESS parameter'를 다음 then의 message2로 넘겼습니다. 즉, 코드 첫 new Promise 생성 라인에서 resolve가 첫 번째 then으로 넘어온 것과 같은 동작을 한 것입니다. 

 

두 번째 then에서도 동일한 방식으로 세 번째 then으로 같은 값을 전달했습니다. 이렇게 출력해 본 결과를 통해서 반복적으로 then을 사용할 수 있다는 것을 확인했습니다.