제네릭....generic....

ooz·2021년 6월 29일
0

typescript

목록 보기
2/2

이름부터 마음에 들지 않는다. generic. 사전에서 generic을 찾아보면..

You use generic to describe something that refers or relates to a whole class of similar things.

그렇다고 한다.

타입스크립트에서의 제네릭은 다양한 타입을 넣어 사용할 수 있는 reusable 코드 덩어리를 만들 때 사용한다고 한다.

예를 들어, 아래처럼 특정 속성의 타입이 어떤 것일지 확신할 수 없을 때, 어떻게 할까?

interface Resource {
  uid: number,
  resourceName: string,
  data: ???????
}

이럴 땐, 아래처럼 제네릭을 이용할 수 있다. 'T'는 으레 쓰는 단어이니 다른 걸로 바꿔도 된다. 인터페이스를 선언할 때, 'data' 속성의 값이 어떤 타입으로 들어올 지 모르겠으니까 일단 T로 해둔다. 그러다 이 인터페이스를 적용할 시점에서 해당 속성의 값은 명시해준 타입의 값이면 된다.

interface Resource<T> {
  uid: number,
  resourceName: string,
  data: T
}

const kpopSingers:Resource<string[]> = {
  // 'data' 속성의 값은 string이 들어있는 배열이면 됨.
  uid: 1,
  resourceName: 'k-pop singer',
  data: ['iu', 'aespa', 'stayc']
}

const person:Resource<object> = {
  // 'data' 속성의 값은 object 타입이면 됨.
  uid: 2,
  resourceName: 'person',
  data: {
    name: 'ex',
    age: 20,
    height: 150
  }
}

그리고 인터페이스를 선언하고 그 인터페이스를 따르는 무언가가 들어있는 배열.. 이런 식으로도 타입을 줄 수 있다. 그러니까 아래처럼.

interface Job {
  title: string;
  location: string;
  salary: number;
  id: string;
}

// ref 메소드에 인자로 전달할 값의 타입이 'Job 인터페이스를 따르는 object가 들어있는 배열' 이다.
const jobs = ref<Job[]>([
  {title: 'singer', location:'none', ...},
  {title: 'writer', location:'korea', ...},
])
profile
사는 것도 디버깅의 연속. feel lucky to be different🌈 나의 작은 깃허브는 https://github.com/lyj-ooz

0개의 댓글