Indexed Access Types

이재윤·2022년 8월 15일
0

TypeScript

목록 보기
2/2
post-thumbnail

💻 Indexed Access Types 이란?

indexed Access Type 이란 다른 타입에서 특정한 프로퍼티를 찾고자 할 때 사용하는 타입 입니다.

💻 사용 예시

type Person = {
  age: number;
  name: string;
  alive: boolean;
}

type Age = Person["age"]
// type Age = string

indexed Access Type 은 그 자체로 타입이기 때문에 union, keyof 와 같은 키워드를 사용할 수 도 있습니다.

type I1 = Person["age" | "name"]
// type I1 = number | string

type I2 = Person[keyof Person]
// type I2 = number | string | boolean

type AliveOrName = "alive" | "name"
type I3 = Person[AliveOrName]
// type I3 = boolean | string

존재하지 않은 index 에 접근하면 에러가 발생합니다.

type I1 = Person["country"]
// property 'country' does not exsit on type 'Person`

💻 Number index

배열 원소의 타입을 가져오기 위한 indexed Access Type 입니다. 보통 typeof 와 함께 사용해 배열 원소의 타입을 가져옵니다.

🖊 사용 예시

const MyArray = [
  {name: "Alice", age: 15},
  {name: "Bob", age: 23},
  {name: "Eve", age: 38}
]

type Age = typeof MyArray[number]["age"]
// type Age = number

// Or
type Person = typeof MyArray[number]
// type Person = {
//   name: string;
//   age: number;
// }
type Age2 = Person["age"]
//type Age2 = number
const tuple = ['tesla', 'model 3', 'model X', 'model Y'] as const

// type Model = tuple[number]
// type Model = "tesla" | "model 3" | "model X" | "model Y"

type TupleToObject<T extends readonly any[]> = {
  [P in T[number]]: P
}

type ObjectTuple = TupleToObject<tuple>
// type ObjectTuple = {
//   'tesla': 'tesla';
//   'model 3': 'model 3';
//   'model X': 'model X';
//   'model Y': 'model Y';
// }

❗️indexed Access Type 은 타입이기 때문에 타입만 넣어 주어야 합니다.

0개의 댓글