제네릭

제네릭

function add (x: string|number, y: string|number): string|number { return x + y }
add<number>(1, 2); //3
add(1, 2);  //3
add<string>('1', '2');  //'12'
add('1', '2');  //12'


add(1, '2'); //'12'
add('1', 2); //'12'

아래 2개가 틀림!

 제네릭을 배우기 전 이렇게 작성하면 안 되는 코드

 

1,2를 더해서 3을 만들고 싶은데 string이 나올 수도 있는 것을 배제하지 못해 코드가 잘못되었다.

 

 

틀린 방법

function add<T>(x: T, y: T): T {return x + y;}

add(1, 2); // 3  같은 타입이니까 가능
add("1", "2"); // '12'  같은 문자열이니까 가능
add(true, false); //타입이 같긴하니까 가능은하다


add(1, '2'); //'12'
add('1', 2); //'12'

아래 2개는 서로 타입이 다르니까 안된다!

 

제네릭: 지금 타입은 모르겠는데 나중에 타입을 정할게!  (타입을 변수처럼 지정)

매개변수끼리는 같은 타입으로 만들어줄 수 있다!

 

 

함수 이름 뒤에 보통 T라고 많이 적는다.

 

 

 

function add<T extends number | string>(x: T, y: T): T {
  return x + y;
}

add(1, 2); // 3
add("1", "2"); // '12'


add(true, false); 
add(1, '2'); //'12'
add('1', 2); //'12'

반드시 T는 number 아니면 string 이여야 한다.

이렇게 코드를 작성하면 아래 3개는 오류가 난다.

 

 

function add<T extends number, K extends string>(x: T, y: K): T {
  return x + y;
}

add(1, 2); // 3
add("1", "2"); // '12'

add(true, false);
add(1, "2"); // '12'
add("1", 2); // '12'

제네릭을 각각 설정해 줄 수도 있다.