[프론트엔드]_JavaScript(es6)_9.Callback - > Promise 전환

공부 자료 : 드림코딩 by 엘리

 

개발 환경 : visual studio code

언어 : js

 

이전에 공부한 콜백과 프로미스를 이용해서 콜백 지옥을 프로미스를 이용해서 간략하게 바꾸는 연습을 하고 메모한다.

 

콜백함수 원본

바꾸게 되면 다음과 같다.

살짝만 보아도 간결해진것을 알 수 있다.

 

promise에서는 상태가 중요하다고 하였다.

콜백함수에서 성공case와 실패시 case를 각각 resolve와 reject로 이해하고 해당 부분을 적용시키면 된다.

우선 Promise는 생성자로 생성을 해줘야 하며, 해당 함수가 선언되고 resolve든 reject든 반환해줘야 하기 때문에 return을 사용해준다.

 

yoon이라는 이름 또는 coder 라는 이름이 각각 id와 password가 지정된 값이 맞으면 resolve를 반환

틀리다면 error 가 들어있는 reject를 반환한다.

 

getRole의 경우 user라는 값을 받고 그값을 비교해서 resolve를 반환할지 reject를 반환할지 결정된다.

 

부르는 부분을 보면 우선 클래스를 참조하는 생성자를 만들고 loginUser에 입력한 id,password를 부여한다. 해당 값에 따라 맞게 된다면 then이 실행되면서 반환된 id는 user로 전달이 되고 그 값이 또 Role에 맞는지 확인하고 맞으면 alert를 실행 틀리다면 catch 부분이 실행된다.

 

중요한 부분은 promise는 resolve와 reject의 상태에 따라서 반환된다는것을 기억하고 코드를 짜면 좀더 손쉽게 짤 수 있을 거 같다.