Promise 객체

Promise 객체란?

• 어떤 작업에 관한 상태 정보를 가지는 객체
• 작업의 결과가 Promise 객체 내에 저장되고, 객체를 보고 작업이 성공했는지와 실패했는지의 여부를 알 수 있음

Promise 객체의 상태

• pending
  • 작업이 진행중임을 의미
• fulfilled
  • 작업이 성공적으로 완료되었음을 의미
  • 작업이 성공해서 promise 객체가 fulfilled 상태가 되면, promise 객체는 작업의 성공 결과도 함께 갖게 됨
  • 작업이 거부된(rejected) 상태여도 프로미스는 확정되었기 때문에 확정된 것으로 간주
• rejected
  • 작업 실패

비동기 처리 문법

JS에서 비동기를 처리하는 방식은 크게 3가지 경우로 볼 수 있다.

비동기 함수 내 처리 함수 내에 함수 실행(콜백함수)

function getDB(callback) {
    // 데이터베이스로부터 3초 후에 데이터 값을 받아온 후, 콜백 함수 호출
    setTimeout(() => {
        const value = 100;
        callback(value);
    }, 3000);
}

function main() {
    // 호출할 작업에 콜백 함수를 넘긴다
    getDB(function(value) {
        let data = value * 2;
        console.log('data의 값 : ', data);
    });
}
main();

• 가장 근본적인 방법
• 자바스크립트의 일급 객체 속성을 이용하여 함수의 매개변수 자체에 함수를 넘김
• 하지만 코드의 복잡도를 증가시켜 콜백지옥이 나타나는 원인이 되기도 함

Promise와 .then

function getDB() {
  return new Promise((resolve,reject) => {
		if(성공시){
			resolve('성공시 반환값')
		} else{
			reject('에러값')
		}
  });
}

function main() {
  getDB()
    .then((value) => 
      console.log('data의 값 : ', value);
    })
    .catch((error) => {
      console.error(error);
    });
    .finally(() => {
	    console.log('성공하든 실패하는 무조건 실행')
    })
}

main();

• .then() 을 통해 비동기 작업의 개수가 많아진다 하더라도 콜백함수를 사용하는 방식의 코드보다는 코드의 깊이가 길어지지 않음
• Promise 객체를 함수로 만들면 필요할 때마다 호출해서 사용하면서 반복되는 비동기 작업을 효율적으로 처리