[typescript] 타입스크립트에서 프로미스 체이닝을 사용하여 api 호출하기
프로미스 체이닝은 비동기 작업을 순차적으로 처리할 수 있게 해주는 패턴입니다. 타입스크립트에서는 프로미스를 사용하여 API 호출을 처리할 수 있으며, 그 과정에서 프로미스 체이닝을 적용할 수 있습니다. 이 글에서는 프로미스를 사용하여 API를 호출하고 응답을 처리하는 방법을 살펴보겠습니다.
프로미스란?
프로미스는 자바스크립트 비동기 처리에 사용되는 객체로, 성공 또는 실패와 같은 비동기 작업의 결과를 나타냅니다. 프로미스는 콜백 지옥을 피하고 코드를 간결하게 작성할 수 있도록 도와줍니다.
API 호출 예제
아래는 타입스크립트에서 프로미스를 사용하여 API를 호출하는 간단한 예제입니다.
function fetchUserData(): Promise<User> {
return fetch('https://api.example.com/user')
.then(response => {
if (!response.ok) {
throw new Error('Failed to fetch user data');
}
return response.json();
});
}
function fetchUserPosts(userId: string): Promise<Post[]> {
return fetch(`https://api.example.com/user/${userId}/posts`)
.then(response => {
if (!response.ok) {
throw new Error('Failed to fetch user posts');
}
return response.json();
});
}
fetchUserData()
.then(user => {
return fetchUserPosts(user.id);
})
.then(posts => {
console.log('User posts:', posts);
})
.catch(error => {
console.error('Error:', error);
});
위 예제에서 fetchUserData 함수는 사용자 데이터를 가져오는 API를 호출하고, 성공적으로 받아오면 fetchUserPosts 함수를 호출하여 사용자의 글 목록을 가져옵니다. 마지막으로 받아온 사용자의 글 목록을 콘솔에 출력합니다.
프로미스 체이닝
프로미스는 then 메서드를 사용하여 체이닝할 수 있습니다. 각 then 메서드에서는 이전 단계에서의 결과를 받아와 다음 작업을 수행할 수 있습니다. 이를 통해 여러 개의 비동기 작업을 순차적으로 처리할 수 있습니다.
결론
타입스크립트에서 프로미스를 사용하여 API를 호출하고 프로미스 체이닝을 적용하는 방법에 대해 알아보았습니다. 프로미스를 활용하면 비동기 작업을 보다 효율적으로 처리할 수 있으며, 코드의 가독성과 유지보수성을 향상시킬 수 있습니다. 프로미스를 잘 활용하여 안정적이고 효율적인 비동기 코드를 작성해보세요.