제네릭

제네릭

---

• 제네릭이란 타입을 함수의 파라미터처럼 함수에 전달하는 문법을 의미합니다.
• 함수에 <>를 사용해서 타입을 정의하고, 호출시에 <>안에 타입을 지정합니다. 호출시에는 <>를 쓰지 않아도 너으 정도 자동으로 지정해주지만, 코드의 가독성이나 안정성을 위해서는 넣는 것이 일반적입니다.
• 함수에 <>에는 type alias처럼 커스텀 네임을  붙일 수 있는데, 일반적으로 T,U,V를 사용합니다

function sort<T>(item: T[]): T[] {
    return item.sort();
}
 
const nums: number[] = [1, 2, 3, 4];
const chars: string[] = ["a", "b", "c", "d", "e", "f", "g",];
 
sort<number>(nums);
sort<string>(chars);

 

 

 

Constraints 

---

• 제네릭은 파리미터로 타입을 받아서 확장성이 높지만, 다른 타입스크립트와 마찬가지로 타입과 맞지 않는 작업을 실행하면 에러가 발생합니다.
• 이런 에러를 방지하기 위해서는 narrowing을 해주거나 제네릭에 제액조건(Constraints)을 설정합니다.
• 제약조건은 특정 타입만 파리미터로 받겠다는 선언으로, 해당 타입이 아닌 타입으로 함수가 실해되지 않습니다.

const printMessage = <T extends string | number>(message: T):T => { //T는 string과 number만 받는다
    return message;
}
 
printMessage<string>("1");
printMessage<number>(1);
printMessage<boolean>(false); //에러. return이 가능한 타입이지만 제약조건에서 거부된

• 또, 함수에서 배열의 length와 같은 내장 프로퍼티를 사용할 때, 만약 타입이 number같은 length를 사용하지 못하는 타입이 올 수 있기에 에러를 발생합니다.
• 인터페이스로 만든 커스텀 타입도 제약조건으로 지정이 가능한데, 이는 위와 같은 경우에 유용합니다.

function loggingIdentity<T>(arg: T): T {
    console.log(arg.length);  // 오류: T에는 .length가 없다.
    return arg;
}

// .length를 가진 인터페이스를 생성한다. 
interface Lengthwise {
    length: number;
}

// extends 키워드로 표현한 인터페이스를 이용하여 제약사항을 명시한다.
function loggingIdentity<T extends Lengthwise>(arg: T): T {
    console.log(arg.length);  // 이제 .length 프로퍼티가 있는 것을 알기 때문에 더 이상 오류가 발생하지 않습니다.
    return arg;
}