상세 컨텐츠

본문 제목

[자바스크립트] 프로미스에 콜백함수가 없다면

카테고리 없음

by esoesmio 2023. 5. 17. 18:13

본문

이게 왜한될까?

 

const borrow = 20;

const payWith10perc = new Promise((resolve, reject) => {
    setTimeout(() => {
        if (Math.random() < 0.5) {
            // 💡 돈을 값을 수 없게 되었을 때
            reject('사업 망함'); // 보통 실패사유나 관련 설명을 넣음
        }
        resolve(borrow * 1.1);
    }, 1000); // 1초 후 갚겠음
});

payWith10perc
    .then(result => {
        console.log(result + '만원');
    }
// 💡 두 번째 인자로 reject를 받는 콜백을 넣을 수 있지만
// 아래처럼 catch로 진행하는 것이 더 깔끔함
    )
   // .then(haha=>{
   //     console.log('기한종료');
   // })

    .then(
        console.log('기한종료'))

 

그이유는 저게 콜백함수를 인자로 받아야하는데 cl 기한종료는 콜백함수가 아니라 바로 샐행되는거라서 먼저 나와버린다.

비동기처리를 해보린다.

 

이 코드에서 '기한종료'가 '22만원'보다 먼저 출력되는 이유는 console.log('기한종료')가 .then 메서드에 바로 실행되는 식으로 작성되었기 때문입니다.

.then 메서드는 콜백 함수를 인자로 받아야 하는데, console.log('기한종료')는 콜백 함수가 아니라 바로 실행되는 함수 호출입니다. 그래서 이 코드는 .then 메서드가 등록될 때 바로 실행되어 '기한종료'를 출력합니다. 그리고 이 시점은 setTimeout에 의해 지연되는 Promise의 결과가 결정되기 전이므로 '기한종료'가 먼저 출력됩니다.

이를 수정하려면 console.log('기한종료')를 콜백 함수로 감싸야 합니다:

javascript
Copy code
payWith10perc
    .then(result => {
        console.log(result + '만원');
    })
    .then(() => {
        console.log('기한종료');
    });
그러나 이렇게 수정해도 '기한종료'는 Promise가 이행되거나 거부되는 모든 경우에 출력되지 않습니다. Promise가 거부되면 두 번째 .then 메서드의 콜백은 호출되지 않습니다. 이 문제를 해결하려면 .finally 메서드를 사용해야 합니다:

javascript
Copy code
payWith10perc
    .then(result => {
        console.log(result + '만원');
    })
    .catch(msg => {
        console.error(msg);
    })
    .finally(() => {
        console.log('기한종료');
    });
이렇게 수정하면 Promise의 결과에 관계없이 항상 '기한종료'를 출력합니다.

 

댓글 영역