본문 바로가기

JavaScript/JavaScript기초

[Javascript] 프라미스(Promise)

프라미스(Promise)란?

프라미스란 자바스크립트에서 비동기 처리에 사용되는 객체로써 콜백을 조금 더 효율적이고 깔끔하게 처리하기 위해 사용됨.

 

프라미스를 사용하면 비동기 처리되는 코드를 마치 동기적으로 처리될 수 있게 할 수 있음.

 

프라미스는 아래와 같이 사용할 수 있음

let myPromise = new Promise(fucntion(resolve,reject){
	
    if(success){
    	
        resolve(someData);
        someData = 11; //이 코드는 무시됨
    }else{
    	
        reject(error);
    }
})

 

Promise에 넘겨준 콜백함수는 executor(실행자) 라고 하며 new Promise 가 생성될 때 자동으로 실행됨.

 

resolve는 성공했을때 아래 value를 결과와 함께 호출하며 reject는 에러가 발생했을떄 error와 함께 호출됨. 

 

resolve와 reject가 실행되면 그시점에 실행자가 종료되며 밑의 코드들은 무시됨.

 

new Promise 로 생성한 객체는 아래와 같은 내부 프로퍼티를 가지고 있음

  • state : 처음 생성시 'pending' 이고 resolve가 실행되면 'fullfilled' , reject가 실행되면 'rejected'로 변경됨
  • result : 처음엔 undefined이었다 resolve(data)가 호출되면 data로, reject(err)가 호출되면 err로 변경됨

하지만 위의 프로퍼티들은 개발자가 직접 접근이 불가능함

 

then , catch, finally

then 은 프라미스가 실행(resolve)되었을 때와 거부(reject)되었을 때 실행되는 메서드

 

then(call1,call2) 의 1번째 인수는 resolve되었을때 실행된 콜백함수이고 2번째 인수는 reject되었을때 실행된 콜백 함수

myPromise
.then(
	
    data => console.log(`성공적으로 ${data} 를 전달받음`),
    error => console.log(`에러발생!! : ${error}`))

 

만약 catch를 사용하여 reject되었을 경우는 따로 작성하고 싶다면 then에는 첫번째 인수만 넘겨주고 catch를 사용하면 됨

myPromise
.then(data => console.log(`성공적으로 ${data} 를 전달받음`)) //resolve 시 실행
.catch(error => console.log(`에러발생!! : ${error}`)) //reject 시 실행

 

finally 메서드는 resolve,reject 여부와 상관없이 무조건 실행됨.

 

then, catch와 다른점은 finally 핸들러에는 결과, 에러 같은 인수가 없고 finally 다음으로 데이터를 넘겨줄 수 있음

myPromise
.finally(() => {//...})//성공,실패여부 상관없이 무조건 실행됨
.then(data => console.log(`성공적으로 ${data} 를 전달받음`)) //resolve 시 data를 넘겨받음
.catch(error => console.log(`에러발생!! : ${error}`)) //reject 시 error를 넘겨받음

 

https://ko.javascript.info/promise-basics