조건부 타입
[TS] TypeScript 타입스크립트 Infer 키워드 활용하기
[TS] TypeScript 타입스크립트 Infer 키워드 활용하기
2024.05.19타입스크립트 infer는 타입을 추론하는데 사용하는 키워드다. 배열 요소 타입, 함수 파라미터 타입, 함수 반환 타입 등 특정 문맥의 타입 추출이 필요할 때 infer를 활용할 수 있다.기본 문법 : T extends infer U ? U : T — U가 추론 가능한 타입이면 U 리턴, 아니면 T 리턴 infer는 타입 구현 영역(할당 연산자 우측)의 조건부 타입(extends 절)에서만 사용할 수 있으며, TS 엔진이 타입을 추론하고 변수(제네릭 타입)에 할당한다. 할당된 변수는 조건부 타입의 true 분기에서만 사용할 수 있다.// Error! 'infer' declarations are only permitted in the 'extends' clause of a conditional type.(t..
[TS] 타입스크립트 두 종류의 키(key) 타입을 받을 때 객체 접근하기
[TS] 타입스크립트 두 종류의 키(key) 타입을 받을 때 객체 접근하기
2024.05.08문제 상황아래와 같은 타입이 있다고 가정해보자.export type OrderStatus = 'pending' | 'new' | '...생략';export type Client = { user_id: number; company_name: string };export type OrderFilterParams = { status: Array; client: Array; // ...생략}; ClientAndOrderFilter 컴포넌트에선 "status" | "client" 두 종류의 타입을 받아 params[type] 형태로 OrderFilterParams 객체에 접근해서 값을 변경해야 하는 상황이다. interface ClientAndOrderFilterProps { setParams: Dispa..
[TS] 타입스크립트 제약 조건과 조건부 타입
[TS] 타입스크립트 제약 조건과 조건부 타입
2024.05.05식별자 영역 / 타입 구현 영역type, interface 키워드를 사용한 타입 선언은 = 등호와 {} 중괄호를 기준으로 식별자(좌), 타입 구현(우) 영역으로 구분할 수 있다.// type 식별자 = 타입 구현type MyType = string | number;// interface 식별자 { 타입 구현 }interface User { name: string; age: number;} 제약 조건 | Constraints식별자 영역에서 사용하는 extends는 제약 조건을 추가할 수 있다. 기본적으로 제네릭엔 모든 타입이 올 수 있지만 제약 조건을 이용해 특정 타입으로 제한할 수 있다.기본 문법 : T extends U — T는 U의 부분 집합(T ⊆ U)으로 볼 수 있음ex) 64 extends ..