자바스크립트[기초] 프로미스 에러 처리 | 프로미스 체이닝

비동기 처리에서 발생한 에러를 처리하는 방법 2가지

• then 메서드의 두 번째 콜백 함수로 처리한다
• catch 메서드를 사용해 처리한다

// then을 이용한 방법
promiseGet(url).then(
	res => console.log(res), // 첫번째 콜백함수(성공)
    err => console.error(err) // 두번째 콜백함수(실패)
);
// catch를 이용한 방법
promiseGet(url)
	.then(res => console.log(res))    // 첫번째 콜백함수(성공)
    .catch(err => console.error(err)); // catch 메서드
    
promiseGet(url)
	.then(res => console.log(res))    // 첫번째 콜백함수(성공)  
 	.then(undefined,err => console.error(err)); // 위에 catch err 부분과 같음

에러 처리를 then 메소드메서드 보다 catch 메서드로 해야 하는 이유 

• catch 메서드를 호출하면 내부적으로 then(undefined, onRejected)을 호출한다.
• then 메서드의 두 번째 콜백 함수는 첫 번째 콜백 함수에서 발생한 에러를 캐치하지 못하고 코드가 복잡 해져서 가독성이 좋지 않다 
• catch 메서드는 가독성도 좋고 명확하며  모든 then 메서드를 호출한 이후에 호출하면 비동기 처리에서 발생한 에러 (rejected 상태) 뿐만 아니라 then 메서드 내부에서 발생한 에러까지 모두 캐치할 수 있다 

---

프로미스 체이닝

• 아래의 예제에서 then -> then -> catch 순으로 후속 처리 메서드를호출하고 있는데 이러한 후속 처리 메서드들은 언제나 프로미스를 반환하기 때문에 연속적으로 호출할 수 있다 이런 것을 프로미스 체이닝이라고 한다 
• 프로미스 체이닝을 통해 비동기 처리 결과를 전달받아 후속 처리를 하기 때문에 프로미스는 콜백 헬이 발생하지 않는다 

// id가 1인 post의 userId를 취득
promiseGet(`${url}/posts/1`)
	// 취득한 post의 userId로 user 정보를 취득
    .then(({ userId }) => promiseGet(`${url}/users/${userId}`))
    .then(userInfo => console.log(userInfo))
    .catch(err => console.error(err));

후속 처리 메서드의 콜백 함수가 인수를 전달받으면서 호출되는 과정 

후속 처리 메서드	콜백 함수의 인수	후속 처리 메서드의 반환값
then	promiseGet 함수가 반환한 프로미스가 resolve 한 값(id 가 1 인 post)	콜백 함수가 반환한 프로미스
then	첫번째 then 메서드가 반환한 프로미스가 resolve 한 값(post 의 userId로 취득한 user 정보 )	콜백 함수가 반환한 값(undefined)을 resolve 한 프로미스
catch  * 에러가 발생하지 않으면 호출 되지 않는다	promiseGet 함수 또는 앞선 후속 처리 메서드가 반환한 프로미스가 reject 한 값	콜백 함수가 반환한 값(undefined)을 resolve 한 프로미스