타입스크립트 제네릭 제한

🤽‍♂️ 제네릭 타입제한

제네릭에서 다양한 타입을 허용하게는 하지만 특정타입만 받을 수 있도록도 가능하다

 

 

🛼  기본적인 제약 걸기

string만 허용 할 수 있도록 제약을 걸어본다

 

type C 같은 경우 number를 넣어서 실제에는 에러가 발생한다.

type A가 string만 허용하게끔 설정되어있기 때문이다

// T가 string이어야 한다
type A<T extends string> = {
  value: T;
};

// error : number는 string이 될 수 없다
type C = A<number>
// string extends string이 때문에 오류가 뜨지 않는다
type B = A<string>;

 

 

🛼  특정 타입을 제약을 걸어보기

원시 타입이아닌 특정타입에 대해서도 제약을 걸어볼 수 있다.

 

Person이라는 인터페이스를 선언하고, Person이라는 인터페이스만 허용한다.

 

만약 makePerson이라는 함수에 name이라는 속성만 넣는다면 오류가 발생한다

Person 인터페이스는 name,age를 가지고 있기 때문이다

interface Person {
  name: string;
  age: number;
}

/* 특정 타입을 갖도록 설정 */
function makePerson<T extends Person>(person: T) {
  console.log(person.age, person.name);
}

const person1: Person = {
  name: "choi",
  age: 32,
};

makePerson(person1);
// error : Person의 형태와 같지가 않다
makePerson({
 	name:'kim'
})

 

 

🎱  유니온 허용

제약을 걸때 유니온 또한 가능하다

string과 number를 허용하고 싶다면 아래처럼 표현이 가능하다

function logging<T extends string | number>(log: T) {
  console.log(log);
}
logging(1);
logging("1");
//error : boolean은 logging의 유니온 타입에 존재하지 않는다
logging(false);

 

 

🥏 객체의 키로 제약걸기

특정 객체가 존재한다면 객체의 키만 허용하도록 제약을 걸 수 있다.

 

c라는 키는 존재하지 않기때문에 오류가 발생한다

/* 객체의 키로 제약걸기 */
function getProperty<T, K extends keyof T>(obj: T, key: K) {
  return obj[key];
}

getProperty({ a: 1, b: 2 }, "a");
// c라는 key는 존재하지 않는다
getProperty({ a: 1, b: 2 }, "c");