개발야옹

[ Javascript ] Promise 본문

Language/Javascript

[ Javascript ] Promise

kitez 2022. 3. 6. 03:14

Asynchronous ( 비동기 )적 처리는 작업을 요청하지만 결과는 그 자리에서 꼭 받지 않아도 되는 데이터 처리 방식

Synchronous ( 동기 )적 처리는 작업을 요청함과 동시에 작업의 결과를 그 자리에서 받을 수 있는 데이터 처리 방식


Promise

Javascript Engine은 Single Thread로 동시에 두가지 작업을 할 수 없다. 이러한 Javascript가 비동기 처리를 할 수 있게 나온 것이 Promise이다.

 

Promise 객체는 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타낸다. 

► 코드의 실행 흐름에서 비동기처리를 유연하게 처리하기 위한 API

 

Promise 객체 상태

1. 대기 ( pendding ) : 이행하지도, 거부하지도 않은 초기 상태.

2. 이행 ( fulfilled ) : 연산이 성공으로 완료됨.

3. 거부 ( rejected ) : 연산이 실패함.

 

Promise.prototype.then() 및 Promise.prototype.catch() 메서드의 반환 값은 새로운 Promise로서 서로 연결할 수 있다. 



 

Promise 객체는 return 값으로 새로운 Promisse를 만들며 이는 서로 연결할 수 있다. 

 

Pendding  대기

new Promise() 메서드를 호출했을 때 pendding ( 대기 ) 상태이다.

Promise 메서드의 인자는 콜백함수이며, 콜백함수의 인자는 resolve, reject 이다.

new Promise(function(resolve, reject) {
	...
});

 

Fulfilled 이행

new Promis() 메서드의 콜백함수에서 resolve()를 수행하면 Fulfilled 이행 상태가 된다.

new Promise(function(resolve, reject) {
	resolve(); // 수행한 경우 fulfilled state
});

이행이 되면 .then() 메서드를 통해서 return 값을 받을 수 있다.

 

Rejected 실패

new Promise() 메서드의 콜백함수에서 reject()를 호출하면 Rejected 실패 상태가 된다.

new Promise(function(resolve, reject) {
	reject(); // rejceted state가 된다.
});

reject 반환값은 .then.catch(error)를 통해서 받을 수 있다.

 

 

참고 :

https://joshua1988.github.io/web-development/javascript/promise-for-beginners/

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise

728x90

'Language > Javascript' 카테고리의 다른 글

[ Javascript ] Array.prototype Methods  (0) 2022.03.08
[ Javascript ] async/await  (0) 2022.03.07
[ Javascript ] Class { ES6 (ES2015) }  (0) 2022.02.20
[ Javascript ] Set Object  (0) 2022.01.11
[ Javascript ] Map Object  (0) 2022.01.11