inflearn logo
강의

講義

知識共有

[リニューアル] TypeScriptオールインワン:Part2. 実践分析編

ジェネリックを活用したレスポンスタイピング

제네릭을 활용한 Response 타이핑 7:40초 질문

507

ryujihye

投稿した質問数 10

0

 

안녕하세요 강의를 듣다가 질문이 생겨 문의드립니다

axios.post 설명 중 interface Created {}가 이해되지 않아 질문 드립니다

import axios, {Axios, AxiosError, AxiosResponse} from "axios";

interface Post {userId: number, id: number, title: string, body: string}
interface Created {}
interface Data {title: string, body: string, userId: 1}

(async () => {
  try {
    const response = await axios.get<Post, AxiosResponse<Post>>(
      "https://jsonplaceholder.typicode.com/posts/1"
    );
    //post<T = any, R = AxiosResponse<T>, D = any>(url: string, data?: D, config?: AxiosRequestConfig<D>): Promise<R>;
    const response2 = await axios.post<Created, AxiosResponse<Created>, Data>('https://jsonplaceholder.typicode.com/posts', {
        title: 'foo',
        body: 'bar',
        userId: 1
    })
    console.log(response.data.id)
    console.log(response2)
  } catch (error) {
     if(axios.isAxiosError(error)) { //커스텀 타입가드
         // {message: "서버 장애입니다. 다시 시도해주세요"}
         console.error((error.response as AxiosResponse<{message: string}>)?.data.message)
     }
    }
  }
})();

 

[index.d.ts] 내의 axios.get의 경우 Post가 있어 타입을 확인할 수 있다는 것은 이해했습니다. 하지만 interface Post와 달리 interface Create는 빈 객체는 axios.post에서 무슨 역할인지 이해되지 않습니다.

개인적인 생각으로는 [index.d.ts]에서 T는 any니까 Create는 단순히 자리만 채우고 실제 타입 역할은 interface Data가 수행하는 것 같았습니다 제대로 이해한 게 맞나 싶어 문의드립니다

그리고 올려주신 강의 늘 잘 듣고 있습니다.

늘 어려운 부분, 이해되지 않는 부분을 쉽게 설명하셔서 감사합니다.

typescrip typescript axios

回答 1

1

zerocho

Created는 AxiosResponse<T>에서 T입니다. 즉, post 요청에 대한 응답의 데이터 타입입니다.

타입 오버라이딩

0

78

2

React19에서 useRef 타입 정의의 변화

0

128

2

jQuery를 $로 한 번 더 감싼 형태

0

58

1

typescript interface를 jsdoc으로 주석달 때

0

234

2

declare module시 import 위치

0

198

2

declare global 로 선언된 타입을 확장하는게 아닌 좁히는것도 가능할가요?

0

148

2

typescript 강의를 보고 개발을 하다가 강의와 다른 내용인데 물어볼곳이 여기밖에 없어서 질문 드립니다.

0

237

1

강의에 필요한 사전준비와 예제 코드 첨부

1

311

1

local.ts 예제코드 첨부 합니다.

1

230

1

redux 예제코드 가져와서 강의 보면서 따라하는데

1

248

1

react 함수 컴포넌트 타이핑은 있는데 클래스 컴포넌트 타이핑 예제 코드가 없네요.

1

287

1

axios 1.6.0 버전으로 보고 있는데영

4

393

1

Module '"axios"' has no default export 에러 나시는분들

0

881

1

안녕하세요, 제로초님 타입스크립트 axios 분석 강의보고 궁금한점이 있어서 질문드립니다

1

389

1

안녕하세요. 제로초님 당신의 강의 매니아 입니다. typescript 모듈 관련 질문이 있어서요.

0

269

1

axios catch 에서 error 타입에 대해 as 없이 이렇게 사용하면 어떨까요?

0

406

1

global 선언 시 export {}

0

298

1

initialState가 제네릭 S인 이유가 잘 이해가 되지 않습니다.

0

310

1

declare module vs declare namespace

0

478

1

declare namespace vs namespace

0

500

2

"axios": "1.4.0" 버전 axios type 코드가 강의와 다릅니다!

0

561

1

Redux type 설정 과정에서 발생한 오류 질문 (ts[2345])

1

383

2

index.d.ts 에서 global declare 선언을 했을 때와 하지 않았을 때의 차이

0

409

1

미들웨어가 커링패턴으로 이루어진 이유

0

442

1