[JS] Promise | 기기기~초초초 개념

Promise

Promise는 비동기 작업을 보다 효율적으로 처리하기 위한 객체로 네트워크 요청을 보내거나 파일을 읽는 등의 비동기 작업을 처리할 때 사용된다. 이름이 Promise인 이유는 작업이 성공/실패 했을때 특정한 동작을 약속했기 때문에..? 사실 잘 모르겠다.

 

Promise의 세 가지 상태

• `pending`(진행중): 작업이 진행중인 상태 
• `fulfilled`(완료): 작업이 완료된 상태 (성공)
• `rejected`(실패): 작업이 실패한 상태 

 

---

 

Promise 객체 생성

const promise = new Promise((resolve, reject) => {
  // 비동기 작업을 수행
  const data = fetch('url 대충');
  
  if (/* 작업 성공 조건 */) {
    resolve(data); // 작업 성공 시 resolve 호출
  } else {
    reject(new Error('실패쓰')); // 작업 실패 시 reject 호출
  }
});

• Promise는 객체이기 때문에 `new` 라는 키워드와 함께 생성한다. 
• 두 가지의 콜백함수를 매개변수로 전달한다.
  • `resolve(value)`: 비동기 작업이 성공적으로 완료되었을때 호출된다. Promise 객체를 완료(fulfilled) 상태로 만들고, 작업의 결과 값을 전달한다. (`value`)
  • `reject(error)`: 작업이 실패했을때 호출된다. Promise 객체를 실패(rejected) 상태로 만들고 reject 안의 내용을 전달한다. 

 

Primise 사용

promise.then((value) => {
	// promise가 성공할 경우 실행
    console.log(value);	// resolve(data)로 전달한 data값이 들어있음
})
.catch((error) => {
	// promise가 실패할 경우 실행
    console.log(error);	// reject(new Error('실패쓰')) 로 전달한 에러 내용이 들어있음
})
 .finally(() => {
    // 성공/실패 상관없이 무조건 한 번 실행될 로직
  });

• `.then(value)`: 작업이 성공했을 경우 `resolve(data)` 로 전달한 데이터를 받는다. 
• `.catch(error)`: 작업이 실패했을 경우 `rejected(error)` 로 전달한 실패 내용을 받는다. 
• `.finally()`: 선택하여 사용 가능하고, 작업이 끝날 때 무조건 한 번 실행된다.