[JavaScript_study] 프로미스(Promise)

* callback를 대체할 수 있는 Promise

• 무겁고, 오래걸리는 일이 있다면 우리코드 내부에서 조금 더 비동기적으로 처리할 수 있게 도와준다.
• 일이 끝나면 수행하줄게!! then(일이 끝난뒤 등록) // catch(에러발생) // finally(최종적으로 모든일이 끝났을때)
• Promise를 쓰게되면 resolve, reject라는 파라미터를 받아온다.
  • 성공 : resolve, 실패 : reject

// Promise를 쓰게되면 resolve, reject라는 파라미터를 받아온다.
// 성공 : resolve, 실패 : reject
// 함수에 대해 필요한 요소만 전달한다.
function runInDelay(seconds) {
  return new Promise((resolve, reject) => {
    if (!seconds || seconds < 0) {
      reject(new Error('seconds가 0보다 작음'));
    }
    setTimeout(resolve, seconds * 1000);
  });
}

// promise를 chaining해서 사용할 수 있다.
runInDelay(2)
  .then(() => console.log('타이머 완료!'))
  // 전달되는 인자와 호출하는 인자가 같으므로 생략가능
  // 원래는 .catch( error => console.error(error))
  // Promise에서 error이 발생했는데 catch로 처리를 해주지 않으면 UnhandledPromiseRejectionWarning에러가 발생한다.
  .catch(console.error)
  .finally(() => console.log('끝났다!'));

 

* Promise chaning 예시 코드

// new Promise를 통해 만드는게 아닌
// 조금 더 심플하게 Static함수를 이용해서 resolve를 호출한다.
// promise를 chaining해서 사용할 수 있다.

function fetchEgg(chicken) {
  return Promise.resolve(`${chicken} => 댤걀`);
}

// fetchEgg("닭").then((egg)=> console.log(egg))

function fryEgg(egg) {
  return Promise.resolve(`${egg} => 계란후라이`);
}

function getChicken() {
  return Promise.reject(new Error('치킨을 가지고 올 수 없음!'));
  // return Promise.resolve(`사육 => 닭`);
}

getChicken()
/**
`사육 => 닭`을 chicken이라는 parameter에 담아서  {return fetchEgg(chicken)} 해당 함수에 전달
fetchEgg함수에 chicken parameter값인 `사육 => 닭`이 들어가서 `사육 => 닭 => 달걀`이 된다.
`사육 => 닭 => 달걀` egg에 전달되고 fryEgg함수 파라미터안에 값이 들어가게된다.
fryEgg 함수에서 return값으로 `사육 => 닭 => 달걀 => 계란후라이`를 반환해준다.
반환된값을 friedEgg안에 넣어준뒤 console창에 띄어준다.
*/

.then(chicken => {return fetchEgg(chicken)})
.then(egg => fryEgg(egg))
.then(friedEgg => console.log(friedEgg))
// 만약 getChicken과정에서 error이 발생한 경우
.catch(error => console.log(error.name))


// 만약 getChicken과정에서 error이 발생한 경우
// catch를 이용해서 error대신에 대체값을 입력하여 유연하게 다른값을 return해주어 error를 유연하게 컨트롤 해준다.
// 전달하는 인자와 호출하는 인자가 같으면 아래와 같이 (함수의 이름만 참조값으로 작성)생략이 가능하다.
getChicken()
  // error를 출력할 필요없이 기본값을 바로 return해주는 경우 아래와 같이 생략이 가능하다.
  .catch(() => '닭')
  .then(fetchEgg)
  .then(fryEgg)
  .then(console.log);