[JavaScript] Promise 정리

Promise : 비동기처리

Promise는 Object의 일종입니다.

Promise로 비동기 처리가 가능합니다. 비동기 처리라 하면, 따로따로 처리할 수 있다는 걸 의미합니다. JavaScript는 원래 위에서 아래로, 순서대로, 차례차례 처리됩니다(동기식 처리). 

Promise는 Producer와 Consumer로 나뉩니다.

---

Producer

---

Promise 생성 

const promise = new Promise(function(resolve, reject){});

Promise는 executor라는 함수를 가집니다. 얘는 JavaScript에서 자체 제공하는 콜백 함수입니다.

executor는 resolve와 reject라는 인자를 받습니다(꼭 resolve와 reject라고 쓰진 않아도 됩니다).

성공했을 때 resolve, 에러 떴을 때 reject가 실행된다고 생각하면 됩니다.

---

Promise의 특성 : state, value

Promise는 처음에는 pending state와 undefined value를 가집니다.

이후 executor에 의해 promise는 둘 중 하나의 state와 value를 가집니다.

executor가 실행되서 성공했을 때는 fulfilled state와 resolve에서 받은 value를 가집니다.

executor가 실행되서 에러가 떴을 때는 rejected state와 error를 value로 가집니다.

fulfiiled 또는 rejected된 promise를 settled promise라고 합니다. 한번 fulfiiled 또는 rejected가 된 promise는 더이상 state를 변경시키지 않습니다. 그래서 executor에 resolve 또는 reject와 관련된 내용이 2개 이상 있을 경우, 가장 먼저 실행된 애만 받고 나머지는 무시합니다.

---

Consumer

Promise가 생성되었으니 생성된 애를 써야합니다. 이때 사용되는 method로 .then, .catch, .finally가 있습니다.

.then

.then은 성공과 에러 값을 받습니다. Promise.then(성공, 에러)로 구성되는데 Promise.then(성공) 처럼 성공만 쓸 수도, Promise.then(,에러) 처럼 실패만 쓸 수도 있습니다.

.catch

.catch는 Promise.then(,에러)와 동일합니다. Promise.catch(에러)라고 사용됩니다.

에러만 처리하고 싶을 때 Promise.catch()로 쓰거나, Promise.then(성공).catch(에러)로 구분지어 쓸 수 있습니다.

.finally

.finally는 인자를 받지 않고 프로미스가 실행되면 항상 실행됩니다. 이점은 .then(성공, 에러)와 유사해 보이지만, 다른 점은 finally에는 state가 없어도 된다는 점입니다. 그래서 받고 있는 인자도 없습니다. 그리고 또 중요한 점은 인자를 받지 않고 상태를 통과시키기에 .finally().then()이나 .finally().catch() 와 같이 작성할 수 있습니다.

 

---

이 글은 아래 주소에서 다룬 내용을 보고 공부한 걸 정리한 글입니다.

 

프라미스

 

 

자바스크립트 - 동기(Synchronous)? 비동기(asynchronous)?