타입스크립트에서 async/await의 타입은 어떻게 정의하나요?
_____`async` 함수는 항상 `Promise`를 반환합니다. 따라서 함수에서 명시적으로 반환 타입을 지정할 때는 `Promise<타입>` 형식으로 지정합니다.
예:
```typescript
async function fetchData(): Promise
return "data";
}
```
---
Q2: `await`의 타입은 어떻게 정의되나요?
`await`는 `Promise`가 해결(resolve)했을 때의 값을 반환합니다. 즉, `await` 뒤에 오는 표현식이 `Promise
예:
```typescript
async function example() {
const data: string = await Promise.resolve("hello");
}
```
---
Q3: 일반 함수에서 `Promise` 타입을 명시하는 방법은?
`async` 키워드 없이 `Promise`를 반환하는 함수도 동일하게 `Promise<타입>`으로 명시합니다.
예:
```typescript
function getNumber(): Promise
return Promise.resolve(42);
}
```
Q4: `async` 함수 내에서 반환할 타입을 제대로 추론받으려면 어떻게 해야 하나요?
`async` 함수 내에서 반환하는 값이 `Promise`인지 아닌지는 타입스크립트가 자동으로 감지합니다. 반환 값의 타입을 명시적으로 지정해주면 타입 안정성을 높일 수 있습니다.
예:
```typescript
async function getUser(): Promise<{ name: string }> {
return { name: "Alice" }; // 자동으로 Promise<{name: string}>로 래핑됨
}
```
---
Q5: `await`가 `any` 타입일 경우 어떻게 개선할 수 있나요?
`await`가 사용할 Promise의 타입이 불분명하면 `any`가 될 수 있습니다. 이런 경우 Promise 객체나 함수 반환값에 명확한 제네릭 타입을 지정해주는 것이 좋습니다.
예:
```typescript
function fetchNumber(): Promise
return Promise.resolve(10);
}
async function example() {
const num: number = await fetchNumber();
}
```
---
요약:
- `async` 함수는 항상 `Promise
- `await`는 `Promise
- 함수 반환 타입을 명확히 지정하면 타입 안정성과 코드 가독성이 높아집니다.
이 기능을 사용할 때, TypeScript는 비동기 함수의 반환 타입을 자동으로 `Promise`로 추론합니다.
이 글에서는 `async/await`의 타입을 정의하는 방법과 관련된 여러 가지 개념을 자세히 설명하겠습니다.
1. 기본적인 async/await 사용법 `async` 키워드를 사용하여 비동기 함수를 정의할 수 있습니다.
이 함수는 항상 `Promise`를 반환합니다.
예를 들어: ```typescript async function fetchData(): Promise
이 함수가 호출되면, 실제로는 `Promise` 객체가 반환되며, 이 객체는 비동기 작업이 완료된 후에 문자열 값을 제공합니다.
2. 반환 타입 정의 비동기 함수의 반환 타입을 명시적으로 정의할 수 있습니다.
예를 들어, 다음과 같이 사용할 수 있습니다: ```typescript async function getUserData(userId: number): Promise
`getUserData` 함수는 `Promise
3. 에러 처리 `async/await`를 사용할 때는 `try/catch` 블록을 사용하여 에러를 처리할 수 있습니다.
이 경우 에러의 타입도 고려해야 합니다.
예를 들어: ```typescript async function getData(): Promise
console.error("Failed to fetch data:", error); throw error; // 에러를 다시 던질 수 있습니다.
} } ``` 위의 코드에서 `error`는 기본적으로 `any` 타입으로 추론됩니다.
에러의 타입을 명시적으로 정의하고 싶다면, 사용자 정의 에러 클래스를 만들거나, 특정 타입을 사용하여 에러를 처리할 수 있습니다.
4. Promise의 제네릭 타입 `Promise`는 제네릭 타입이므로, 반환되는 값의 타입을 명시할 수 있습니다.
예를 들어, 다음과 같이 정의할 수 있습니다: ```typescript async function getNumber(): Promise
5. 여러 비동기 작업 처리 여러 비동기 작업을 동시에 처리할 때는 `Promise.all`을 사용할 수 있습니다.
이 경우 반환 타입은 `Promise`의 배열로 정의할 수 있습니다.
```typescript async function fetchMultipleData(): Promise<[string, number]> { const [text, number] = await Promise.all([ fetch("https://api.example.com/text").then(res => res.text()), fetch("https://api.example.com/number").then(res => res.json()) ]); return [text, number]; } ``` 위의 예제에서 `fetchMultipleData` 함수는 `Promise<[string, number]>`를 반환합니다.
6. async/await와 타입 추론 TypeScript는 비동기 함수의 반환 타입을 자동으로 추론합니다.
따라서 명시적으로 타입을 정의하지 않아도 되는 경우가 많습니다.
그러나 명확성을 위해 타입을 명시적으로 정의하는 것이 좋습니다.
7. TypeScript에서 `async/await`를 사용할 때는 비동기 함수의 반환 타입을 `Promise`로 정의하는 것이 기본입니다.
비동기 작업의 결과 타입을 명시적으로 정의하여 코드의 가독성을 높이고, 에러 처리에 신경 써야 합니다.
TypeScript의 타입 시스템을 활용하여 비동기 프로그래밍을 보다 안전하고 효율적으로 수행할 수 있습니다.
작성자:
이주희 [비회원]
| 작성일자: 1년 전
2024-09-10 05:32:15
조회수: 232 | 댓글: 0 | 좋아요: 0 | 싫어요: 0
조회수: 232 | 댓글: 0 | 좋아요: 0 | 싫어요: 0
내용이 부정확하다면 싫어요를 클릭해주세요.