inflearn logo
강의

Course

Instructor

Advanced TypeScript skills learned through hands-on practice

Fetch function type

제네릭을 활용해서 정답을 맞춰보았습니다!

Resolved

329

rhkdtjd124829

138 asked

1

import { Equal, Expect } from "../helper";
import { expect, it } from "vitest";

const fetchData = async <T>(url: string): Promise<T> => {
  const data = await fetch(url).then((response) => response.json());
  return data;
};

it("Should fetch data from an API", async () => {
  const data = await fetchData<{ name: string }>(
    "https://swapi.dev/api/people/1"
  );
  expect(data.name).toEqual("Luke Skywalker");

  type tests = [Expect<Equal<typeof data, { name: string }>>];
});

감사합니다.

 

정답을 확인 해보니까

data에 제네릭 T를 줘야 하군요. 저처럼 하게 되면 data는 any로 추론 되네요!

typescript

Answer 2

1

aftercamp

👍
비슷한 질문은

https://www.inflearn.com/questions/1161813/%EC%A0%9C%EB%84%A4%EB%A6%AD%EC%9D%84-%EB%B6%99%EC%9D%B4%EB%8A%94-%EA%B3%B3

확인해보시면 좋을 것 같습니다.

0

communityai8509

안녕하세요, 인프런 AI 인턴입니다.
rhkdtjd_12님, 타입스크립트에서 제네릭을 사용하여 API 응답 타입을 명시하는 방법을 잘 적용하셨습니다.
비동기 함수 fetchData에서 제네릭 타입 T를 사용하여 반환 타입을 Promise<T>로 명시함으로써, 호출 시점에서 원하는 타입을 지정할 수 있게 하심으로써 코드의 타입 안정성을 높이는 장점이 있습니다.
제네릭을 사용하지 않으면, 타입스크립트 컴파일러는 반환되는 데이터의 타입을 알 수 없어 any 타입으로 추론할 가능성이 있기 때문에, 타입 안정성을 보장하는 측면에서 제네릭 사용이 매우 중요합니다.
더불어 작성하신 테스트 케이스 역시 타입의 기대값을 확인하는 데에 적절하게 사용되었습니다.
질문과 관련된 추가적인 내용이 필요하시다면 언제든지 문의해 주세요.

이게 된다는걸 어떻게 판단할 수 있나요?

0

58

2

연습문제 강의 확인 부탁드립니다.

0

80

2

object key 질문드립니다.

0

66

1

행운 닉네임 등록부탁드립니다!

0

136

2

각 강의에 대한 설명 링크 404에러

0

68

2

행운문제 닉네임 등록 요청드립니다

0

63

2

블로그 링크 문제

1

122

1

제네릭과 사용자 정의 타입 가드에 관한 질문

1

168

1

제네릭 타입 제한을 하는것이 어떤 장점이 있을까요 ?

1

140

1

행운문제 닉네임 등록 신청합니다!

0

110

2

행운문제 테스트 유저 이름 입력 요청

0

128

2

행운문제 닉네임 입력 요청

1

157

2

행운문제 테스트 유저 이름 입력 요청

1

139

2

설명 블로그에 대한 질문

2

128

3

행운동전!

0

115

2

행운문제 테스트 유저 이름 입력 요청

0

122

1

행운 테스트 문제 400 에러

0

177

2

행운 테스트 문제 (존재하지 않는 유저입니다.)

1

203

2

행운테스트 동전이용!!

0

209

2

연습문제 링크 이슈

2

222

3

화살표 함수와 일반 함수의 매개변수 추론 관련

1

305

2

cache 강의 질문

1

209

1

Record의 제네릭은 자동적으로 바뀌나요?

0

377

2

extends와 = 의 차이는 무엇인가요?

1

221

1