TypeScript - Generics

Generics

Generics는 typescript에서 함수, 클래스, 인터페이서, typealias를 사용하게 될 때 여러 종류의 타입에 대하여 호환을 맞춰야 하는 상황에서 사용하는 문법이다.

<T> 이렇게 생긴 것이 Generics이다.

//function의 파라미터에 a,b에 들어오는 값이 정해져 있지 않는 경우 generics를 쓰게된다.
function merge (a: any, b: any) {
  return{
    ...a,
    ...b,
  };
}

const merged = merge({foo: 1}, {bar: 2});
// generics를 사용하면
function merge<T1, T2> (a: T1, b: T2) {
  return{
    ...a,
    ...b,
  };
}

const merged = merge({foo: 1}, {bar: 2});
merged./*라고 하면 안에 foo와 bar가 들어있는 것을 볼 수 있다.*/

이렇게 generics를 쓰게 되면 실제 파라미터에 넣게 되는 타입이 유추가 되는 것이다.

Ex2) 또 다른 활용 사례

functino wrap <T> (param: T) {
  return{
    param
  };
}

const wrapped = wrap(10);

wrapped./*이렇게 하면 위에 wrap()안에 넣는 값에 따라 타입이 지켜지면서 어떤 형태인지 알 수 있다.*/

Ex3) interface와 typealias에서도 사용할 수 있다.

interface Items<T> {
  list: T[]
};

const items: Items <string> = {
  list: ['a', 'b', 'c']/*list가 위에서 string을 넣어줬기 때문에 string을 넣어줘야 한다. 즉 number을 넣어주게 되면 number를 넣어야 한다.*/
};

//typealias로 구현
type Items<T> = {
  list: T[];
};

const items: Items <string> = {
  list: ['a', 'b', 'c']
};
//Generics는 여러개여도 상관없다.
type Items<T, V> = {
  list: T[];
  value: V[];
};

const items: Items <string, number> = {
  list: ['a', 'b', 'c'],
  Value: [1, 2, 3]
};

Ex4) 클래스에서 Generics를 사용하는 방법

class Queue<T> {
  list : T[] = [];

  get length() {
    return this.list.length;
  }
  enqueue(item: T) {
    this.list.push(item);
  }
  
  dequeue() {
    return this.list.shift();
  }
}

const queue = new Queue<number>();

queue.enqueue(0);
queue.enqueue(1);
queue.enqueue(2);
queue.enqueue(3);
queue.enqueue(4);

while (enqueue.length > 0) {
  console.log(queue.dequeue());
}

Q라는 것은 데이터를 등록할 수 있는 자료형이며, 먼저 등록한 것을 먼저 뽑아올 수 있다.

1. enqueue: Q에다가 새로운 것을 등록하는 것이다.
2. dequeue: Q에서 가장 첫 번째 항목을 빼오는 것이다.