#5 - Promise

Promise란?

자바스크립트에서 비동기 동작을 다루기 위한 패턴으로, 비동기 요청을 보내면 성공 또는 실패가 다양한 형태로 발생한다. promise의 동작 과정은 pending, fulfilled, rejected 3가지 상태로 구분된다.

1. 대기(pending): 이행하지도, 거부하지도 않은 초기 상태.
2. 이행(fulfilled): 연산이 성공적으로 완료됨.
3. 거부(rejected): 연산이 실패함.

대기 중인 프로미스는 값과 함께 이행할 수도, 어떤 이유(오류)로 인해 거부될 수도 있습니다. 이행이나 거부될 때, 프로미스의 then 메서드에 의해 대기열(큐)에 추가된 처리기들이 호출됩니다. 이미 이행했거나 거부된 프로미스에 처리기를 연결해도 호출되므로, 비동기 연산과 처리기 연결 사이에 경합 조건은 없습니다.

let myFirstPromise = new Promise((resolve, reject) => {
  // 우리가 수행한 비동기 작업이 성공한 경우 resolve(...)를 호출하고, 실패한 경우 reject(...)를 호출합니다.
  // 이 예제에서는 setTimeout()을 사용해 비동기 코드를 흉내냅니다.
  // 실제로는 여기서 XHR이나 HTML5 API를 사용할 것입니다.
  setTimeout( function() {
    resolve("성공!")  // 와! 문제 없음!
  }, 250)
})

myFirstPromise.then((successMessage) => {
  // successMessage는 위에서 resolve(...) 호출에 제공한 값입니다.
  // 문자열이어야 하는 법은 없지만, 위에서 문자열을 줬으니 아마 문자열일 것입니다.
  console.log("와! " + successMessage)
});

* 쉽게 이해하는 동기와 비동기

동기
동기는 데이터의 요청과 결과가 한 자리에서 동시에 일어나는것을 말합니다.
사용자가 데이터를 서버에게 요청한다면 그 서버가 데이터 요청에 따른 응답을 사용자에게 다시 리턴해주기 전까지 사용자는 다른 활동을 할 수 없으며 기다려야만합니다.
요청을 하면 시간이 얼마나 걸리던지 요청한 자리에서 결과가 주어져야 합니다.

비동기
비동기는 동시에 일어나지 않는다는 의미입니다.
요청한 결과는 동시에 일어나지 않을거라는 약속입니다.

• 참조 - [MDN - Promise]
• 다음시간에는 promise 문법의 단점을 최소화하기 위해 사용하는 async/await 문법을 알아보기로 하자