목차
제네릭은 TypeScript에서 타입을 추상화하여 재사용 가능한 코드를 작성하는 방법 중 하나입니다. 함수, 클래스, 인터페이스 등 여러 곳에서 사용될 수 있으며, 특정 타입 대신 코드가 실행될 때 타입이 결정되도록 합니다. 제네릭을 사용하면 코드의 재사용성과 유지 보수성이 향상되며, 코드의 유연성과 확장성이 높아집니다.
▼ 제네릭을 사용하지 않은 코드
function getFirstNumber(numbers: number[]): number | undefined {
return numbers[0];
}
function getFirstString(strings: string[]): string | undefined {
return strings[0];
}
const numbers = [1, 2, 3];
const firstNumber = getFirstNumber(numbers);
console.log(firstNumber); // 1
const strings = ['a', 'b', 'c'];
const firstString = getFirstString(strings);
console.log(firstString); // a
위의 코드에서 getFirstNumber 함수와 getFirstString 함수가 각각 숫자와 문자열 배열에 대해 작동하도록 구현되어 있습니다. 이 경우 함수 구현이 중복되기 때문에 코드의 가독성과 유지보수성이 저하될 수 있습니다. 또한, 새로운 유형의 데이터에 대해 함수를 작성할 때마다 새로운 함수를 구현해야 하는 문제점이 있습니다.
▼ 제네릭을 사용한 코드
function getFirstItem<T>(items: T[]): T | undefined {
return items[0];
}
const numbers = [1, 2, 3];
const firstNumber = getFirstItem(numbers);
console.log(firstNumber); // 1
const strings = ['a', 'b', 'c'];
const firstString = getFirstItem(strings);
console.log(firstString); // a
위의 코드에서 <T>는 제네릭 타입 매개변수로 사용됩니다. 함수의 items 매개변수는 T 배열입니다. 따라서 함수의 반환 유형은 T 또는 undefined 입니다. getFirstItem 함수는 numbers 배열과 strings 배열 모두에 대해 작동합니다. 제네릭은 타입스크립트의 강력한 기능 중 하나이며, 타입 안정성을 유지하면서 다양한 유형의 데이터를 다룰 수 있도록 도와줍니다.
공식문서 : https://www.typescriptlang.org/docs/handbook/2/generics.html
반응형