JavaScript Promise 체인과 체인 없음의 차이

카테고리

프로그래밍/소프트웨어 개발

서브카테고리

웹 개발

대상자

JavaScript 초보 개발자 및 비동기 프로그래밍 개념을 이해하고자 하는 사람들

핵심 요약

• Promise 체인은 .then() 핸들러를 이어서 연결하여 이전 결과를 다음 핸들러로 전달하는 방식으로, 최종 결과가 190으로 계산됨
• Promise 체인 없음은 매번 원본 프로미스(ten)에 .then()을 별도로 연결하여 이전 결과를 사용하지 않음으로, 최종 결과가 10으로 계산됨
• 체인 방식은 비동기 작업의 연쇄적 처리를 가능하게 하며, 체인 없음은 각 .then()이 독립적인 작업으로 동작함

섹션별 세부 요약

1. Promise 체인 예시

• new Promise() 생성자로 ten 프로미스 생성
• .then()을 여러 번 이어서 연결하여 결과 전달
• 첫 번째 .then()에서 10 + 10 = 20
• 두 번째 .then()에서 20 * 10 = 200
• 세 번째 .then()에서 200 - 10 = 190
• 최종 console.log(result)에 190 출력

2. Promise 체인 없음 예시

• 매번 원본 프로미스(ten)에 .then()을 별도로 연결
• 첫 번째 .then()에서 10 + 10 = 20
• 두 번째 .then()에서 원본 값인 10을 기반으로 10 * 10 = 100
• 세 번째 .then()에서 원본 값인 10을 기반으로 10 - 10 = 0
• 최종 console.log(result)에 10 출력

3. 실무적 주의사항

• .then()을 이어서 연결하지 않고 원본 프로미스를 매번 재사용하면 이전 결과가 무시됨
• 체인 방식은 비동기 작업의 연속성과 예외 처리를 효율적으로 관리 가능

결론

• Promise 체인을 사용할 때는 .then()을 이어서 연결하여 이전 결과를 전달해야 하며, 원본 프로미스를 반복적으로 사용하면 오류 발생
• 체인 방식은 비동기 작업의 연쇄적 처리를, 체인 없음은 독립적인 작업 처리를 의미함