5. Node Promise

안녕하세요! 효그니에요! 이번차시에는 Promise를 배워볼거에요!

방금 점심을 회사 구내식당에서 먹고왔는데! 와! 맛집! 하핳! 여러분도 맛난거 들면서 하세요!

그럼 시작해볼까요?

Promise란?

저번 시간에 자바스크립트의 비동기와 async/await 을 사용한 처리를 배웠었죠?

Promise는 async/await처럼 자바스크립트의 비동기 처리에 사용되는 문법입니다! 와! 비동기! 와! 샌즈!

Promise의 상태

Promise는 크게 세 가지의 상태를 갖고 있습니다!

• Pending ( 대기 ) - 아직 로직 처리가 완료되지 않은 경우
• Fulfilled ( 이행 ) - 로직 처리가 완료되어, 결과 값을 반환한 경우
• Rejected ( 실패 ) - 로직 처리 중, 실패하거나 오류가 발생한 경우

Pending

아래와 같이 Promise 함수를 호출하면 Pending 상태가 됩니다.

new Promise()

아직 아무런 동작도, 완료도 시켜주지 않았습니다.

new Promise( (resolve, reject) => {

})

Promise 는 인자 값으로 콜백 함수를 추가할 수 있고, 그 콜백 함수의 인자 값으로는

resolve, reject 가 있습니다!

resolve, reject 등을 사용하지 않았을 경우, "대기" 상태라고 보시면 될 것 같습니다!

Fulfilled

new Promise( (resolve, reject) => {
	resolve()
})

resolve 를 호출하게 되면 Fulfilled 상태가 됩니다. "then" 을 사용하여 resolve 안의 인자 값을 갖고올 수 있습니다.

const Test = () =>
		new Promise((resolve, reject) => {
			resolve('안녕 내 이름은!');
		});

Test().then((data) => {
	console.log(data);
});

Promise 객체를 반환하는 Test 함수를 작성하고, Promise의 resolve를 채워넣었습니다!

then을 사용하는 콜백 함수마저 싫으시다면... (야!!!)

let result = await Test();
console.log(result);

저번 시간에 배운 것을 활용할 수도 있습니다.

Fulfilled 상태를 '이행' 이 아닌 '완료' 로도 표현할 수 있습니다.

Rejected

new Promise( (resolve, reject) => {
	reject()
})

reject가 호출되면 실패입니다.

.catch를 사용하여 잡아낼 수 있습니다.

const Test = () =>
		new Promise((resolve, reject) => {
			reject();
		});

Test().then((data) => {
	console.log(data);
}).catch(()=> {
	console.log('에러 발생!');
});

개발을 하다보면 한 Promise 객체 안의 reject의 사유가 여러 가지 일 수 있습니다.

const Test = () =>
		new Promise((resolve, reject) => {
			reject(new Error('제가 에러를 한 번 내보겠습니다.'));
		});

	Test()
		.then((data) => {
			console.log(data);
		})
		.catch((e) => {
			console.log('에러 발생!', e);
		});

위와 같이 에러 객체를 reject의 인자 값으로 반환하여, 에러의 사유를 만들 수 있습니다!

이상으로 글을 마치겠습니다!

배가 터질거같아요 여러분! 여러분도 과식은 금물입니다...