Promise가 직관적으로 이해되지 않는 사람들을 위한 글

이곳 저곳에서 여러 동작들과 예시 코드를 보았지만 직관적으로 와닿지가 않는 사람들을 위한 글.

(다른 말로 바로 나를 위한 글)

Promise 객체가 하는 일.

1. Promise 객체는 선언할 때 정의한 함수가 resolve() 를 외치기 전까지 해당 객체 이후 실행될 .then()으로 넘어가지 않는다.

다른 말로, 처음 정의한 함수의 안에서 resolve(리턴값)이 실행 될 때 까지 기다려준다.

그렇기 때문에, 기존의 함수들이 

function fn1( input , callback) {

블라블라

callback(input2)

}

function fn2(input)
{

블라블라 이후의 작업들

}

fn1(input,fn2);

이런식으로 진행되었던 반면,

function fn1(input){

return Promise(function(resolve, reject){

블라블라

resolve(input2);

})

}

function fn2(input2){

블라블라 이후의 작업들

}

fn1(input).then( fn2 )  *직관적

이런 식으로 보이게 코딩할 수 있다는 것이다.

또한, 그 이후의 리턴값을 프라미스 객체로 감싸주어

new Promise(function(resolve, reject){
  setTimeout(function() {
    resolve(1);
  }, 2000);
})
.then(function(result) {
  console.log(result); // 1
  return result + 10;
})
.then(function(result) {
  console.log(result); // 11
  return result + 20;
})
.then(function(result) {
  console.log(result); // 31
});

이런 코드 또한 가능하게 한다.

두번째 이후 코드부터 분명 리턴값은 value인데 .then()으로 연결되었음을 볼 수 있다.

3. Promise 객체는 resolve()를 할 것인지 reject를 할 것인지 분기를 나눠서 각각의 상황을 따로 처리할 수 있게 해준다.

4. 추가로

new Promise(function (resolve, reject) {

  resolve(someSynchronousValue);

}).then(/* ... */);

이라는 코드를 ->

Promise.resolve(someSynchronousValue).then(/* ... */);

으로 표현할 수 있다.