엘리스 SW 엔지니어 트랙 4주차(2)

ChanghyeonO·2023년 3월 28일
0
post-custom-banner

저번시간 콜백함수를 사용했을 때 나타날 수 있는 단점인 콜백지옥을 어떻게 해결할 것인지에 대해 알아보자.

콜백함수를 연달아 사용하게 되면 가독성이 무척이나 떨어지게 된다.
이를 해결하기 위해 나온게 Promise 디자인 패턴이다.

let promise = new Promise();
promise.then(function(){})
.catch(function(){});

프로미스 예시.

new Promise()문법으로 프로미스라는 변수 객체를 하나 생성하면 된다.
그럼 프로미스 변수에다가 .then()을 붙여서 실행할 수 있다.

프로미스 안의 코드가 실행이 완료되었을 때 then() 함수 내의 코드를 실행시켜주고
실행에 실패했을 때 catch() 함수 내의 코드를 실행시켜준다.

이런식으로 코드를 차례로 실행할 수 있게 도와주는 디자인 패턴이 Promise다.

Promsie가 콜백함수보다 좋은 이유
-콜백함수와는 다르게 순차적으로 뭔가를 실행할 때 코드가 옆으로 길어지지 않는다.
-콜백함수는 불가능한 실패 시 특정코드 실행이 가능하다.

Promise의 뜻과 사용법

성공하면 then() 실패하면 catch()를 실행
이라는 코드를 짤 수 있도록 해주는게 Promise이다.
간단하게 정의하자면 성공&실패 판정기계이다.

let promise = new Promise(resolve, reject){
	let difficultCal = 1 + 1;
	reslove(difficultCal);
});

promise.then(function(a){
	console.log("연산성공!" + a);
})
.catch(function(){
	console.log("연산실패")
});

Promise()안에 콜백 함수를 하나 추가하면 그 안에서 성공/실패 판정이 가능하다.
resolve()라고 첫번째 파라미터를 함수형태로 작성하면 성공판정,
reject()라고 둘째 파라미터를 함수형태로 작성하면 실패판정이 된다.

연산결과를 then() 내부에서 활용하려면 resolve()에 변수명을 넣어주고 then함수 내부에 파라미터로 넣어 활용 할 수 있다.

Promise의 특징
1.new Promise()로 생성된 변술를 콘솔창에 출력하면 현재 상태를 알 수 있다.
성공/실패 판정 이전엔 <pending> 성공 후엔 <resolved> 실패 후엔 <rejected> 이렇게 나온다.

2.Promise는 동기를 비동기로 만들어주는 코드가 아니다.
Promise는 비동기적 실행과 관련이 없고 코딩을 예쁘게 해주기 위한 디자인 패턴일 뿐이다.

profile
꾸준한 기록을 통해, 좋은 개발자가 되겠습니다.
post-custom-banner

0개의 댓글