TypeScript

06. 제네릭

js0616 2024. 8. 27. 21:01

https://poiemaweb.com/typescript-generic

 

TypeScript - Generic | PoiemaWeb

제네릭은 선언 시점이 아니라 생성 시점에 타입을 명시하여 하나의 타입만이 아닌 다양한 타입을 사용할 수 있도록 하는 기법이다. 한번의 선언으로 다양한 타입에 재사용이 가능하다는 장점이

poiemaweb.com

 

정적 타입 언어의 경우, 함수 또는 클래스를 정의하는 시점에 매개변수나 반환값의 타입을 선언하여야 한다.

그런데 함수 또는 클래스를 정의하는 시점에 매개변수나 반환값의 타입을 선언하기 어려운 경우가 있다.

 

제네릭은 선언 시점이 아니라 생성 시점에 타입을 명시하여 하나의 타입만이 아닌 다양한 타입을 사용할 수 있도록 하는 기법이다. 한번의 선언으로 다양한 타입에 재사용이 가능하다는 장점이 있다. T는 제네릭을 선언할 때 관용적으로 사용되는 식별자로 타입 파라미터(Type parameter)라 한다. 

function reverse<T>(items: T[]): T[] {
    return items.reverse();
}

const arg = [1, 2, 3, 4, 5];
// 인수에 의해 타입 매개변수가 결정된다. 타입 매개변수는 number
const reversed = reverse(arg);
console.log(reversed); // [ 5, 4, 3, 2, 1 ]

const arg2 = [{ name: 'Lee' }, { name: 'Kim' }];
// 인수에 의해 타입 매개변수가 결정된다. 타입 매개변수는 {name: string}
const reversed2 = reverse(arg2);
console.log(reversed2); // [ { name: 'Kim' }, { name: 'Lee' } ]

 

 

 

class Box<T> {
    private value: T;
   
    constructor(value: T) {
        this.value = value;
    }
   
    getValue(): T {
        return this.value;
    }
}

let stringBox = new Box<string>("Hello");
let numberBox = new Box<number>(123);

console.log(stringBox.getValue());  // Hello
console.log(numberBox.getValue());  // 123

 

function gen<T> (num: T){
    console.log(num,'의 타입 : ' , typeof num )
}

gen(123)        // 123 의 타입 :  number
gen('abc')      // abc 의 타입 :  string
gen({'a':123})  // { a: 123 } 의 타입 :  object

 

any 랑 뭐가 다른거지 그럼 ?

 

gpt

  • any는 타입 검사를 하지 않고 모든 타입을 허용합니다. 타입 안전성이 떨어지고, 에러를 사전에 방지하기 어렵습니다.
  • 제네릭은 타입 파라미터를 사용하여 다양한 타입을 처리할 수 있도록 하며, 타입 안전성을 유지합니다. 재사용성과 코드의 가독성을 높이면서 타입 오류를 사전에 방지할 수 있습니다.

 

 

https://joshua1988.github.io/ts/guide/generics.html#%EC%A0%9C%EB%84%A4%EB%A6%AD-%ED%83%80%EC%9E%85-%EB%B3%80%EC%88%98