inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편

key-value 타입 자동추론 질문드립니다

264

지혜

작성한 질문수 2

0

const StreamingProtocolList = ['HLS', 'DASH', 'CMAF'] as const
export type UnionOfTuple<T extends readonly any[]> = T[number]
export type IStreamingProtocol = UnionOfTuple<typeof StreamingProtocolList>
export const isCMAFProtocol = (protocol: IStreamingProtocol) => protocol === 'CMAF'

export interface IEndpoint {
    ce_id?: string
    ce_description: string
    ce_drm_yn: YN
    ce_type: IStreamingProtocol
    ce_hls_manifest_id: string | null
}

위와같이 타입을 만들어놓고 컴포넌트단에서 onchange시에 key값과 value값을 인자로 던졌을때, 해당 key값에 대한 value타입을 자동추론하려고 합니다.

 

 const onChangeHandler = useCallback(
        <K extends keyof IEndpoint>({ key, value }: { key: K; value: IEndpoint[K] }) => {
            setState(prev => {
                if (key === 'ce_type') {
                    return { ...prev, ce_hls_manifest_id: isCMAFProtocol(value) ? 4464 : null, [key]: value }
                } else {
                    return { ...prev, [key]: value }
                }
            })
        },
        [],
    )

 제가원하는건 위의라인에 isCMAFProtocol에 들어가는 value가 IStreamingProtocol타입으로 자동추론되는건데

TS2345: Argument of type string | number is not assignable to parameter of type 'HLS' | 'DASH' | 'CMAF
라 발생하며 추론을 못하는 상황입니다.

 

이런 경우에는 제가 IStreamingProtocol에 대한 custom 타입가드함수를 만들어서 강제로 타입을 전환시켜야 되는 방법밖에 없을까요?

 

typescript

답변 1

1

제로초(조현영)

가장 쉽게 강제로 변환하는 건 다음 코드고요.

ce_hls_manifest_id: isCMAFProtocol(value as IEndpoint['ce_type']) ? 4464 : null

깔끔한 방법은 저도 좀 고민좀 해보겠습니다.

0

지혜

넵 감사합니다!!

데코레이터가 현재도 자주 쓰이는 문법인가요?

0

76

2

유틸리티 타입 실제로 구현은 못해도 하나씩 외우면 실무할 때 지장 없겠죠?

0

63

1

매핑 타입은 type에서밖에 안된다고 하네요?

0

62

2

자바에서의 오버로딩과 같은 개념이라고 생각해도 되나요?

0

67

2

filter 함수 반환 타입 네로잉 질문

0

70

2

map<U>(callbackfn: ....) 할때 U는 왜 여기 있는거에요??

0

44

2

ts 컴파일을 위한 type 라벨링 부분

0

44

1

concat 함수 타입 구현 중 질문 있습니다!

0

99

2

filter 메소드 질문

0

52

1

forEach 제네릭 관련 문의

0

59

1

타입 추론 시 가장 넓은 범위로 추론이 되는 건가요?

0

162

1

enum이 javascript로 트랜스파일링될때 사라진다하셨는데요

0

206

1

함수 파라미터 타입 정의 시 ...args: any[]와 ...args: any 의 차이

0

223

1

Flat type에서 ReadonlyArray 타입을 사용하는 이유?

0

157

1

bind type 질문

1

147

1

Lowercase type 관련 질문

0

151

1

타입스크립트 교과서, p131

0

264

1

타입스크립트 교과서 p122 forEach 메서드 질문

0

231

1

타입스크립트 교과서 p116 , 코드에러남

1

268

1

타입스크립트 교과서 p112 , 코드가 안읽힙니다..

0

263

1

타입스크립트 교과서 p83

1

182

1

타입스크립트교과서 p39 쪽 코드가 이해가 안되요

1

224

1

class 에서 ts의 private vs js의 private field( # )

0

335

1

ts -> js 로 변환할 때 타입선언을 남겨두는걸 추천하는 이유

0

254

1