[JavaScript] Promise

Gomao·2023년 3월 26일
0

Web programming

목록 보기
6/16

Promise는 뭐지?

자바스크립트에서 비동기 처리에 사용되는 객체이다.

Promise의 실행 흐름

Pending(대기 중) -----> Fulfilled(이행) or Rejected(실패)

1.Pending

new Promise((resolve,reject) => {

});

단순히 메서드를 호출한 상태, 콜백함수의 인자는 resolve, reject가 있음.

2.Fulfilled and Rejected

function gomao(){
	new Promise((resolve,reject) => {
		if(func1){
    		resolve();
    	}
    	else{
    		reject();
    	}
	});
}

gomao()
.then(function_if_resolve)
.catch(function_if_reject)

fulfilled --> resolve --> then
rejected --> reject --> catch

Promise Chaining

이 promise를 연쇄적으로 사용 가능하다.

fulfilled되어 then() 메서드를 호출하면 return값 또한 promise이기 때문에,
다시 then()을 계속해서 이어줄 수 있다.

function gomao(){
	return new Promise({
    	...
    });
}

gomao()
.then(func1)
.then(func2)
.then(funce)
...

이때 catch 대신 then을 이용해서 에러 처리를 해줄 수도 있다(하지만 추천X)
=> "어디서 오류가 났는지 확인하기 어려울 수 있다!
따라서 에러 처리는 catch를 사용하는 것이 좋다.

Promise 사용 예시

연습하다 너무 재미있어서 기능을 추가하다가 
코드가 너무 길어진 관계로..
실행 스샷만 첨부하고 코드는 링크를 걸겠다..

JavaScript 코드 (github 링크)

어느정도 이해가 된 듯 하다.
아직 json이나 html/css를 자유자재로 다루지 못하다 보니
인터페이스는 아직 많이 허접하다.
일단 지금은 Promise에 대해 다시 한 번 익힌 것을 생각하고,
이어서 Async Await에 대해서 마저 포스팅을 준비하겠다.

profile
코딩꿈나무 고마오

0개의 댓글