TypeScript 제네릭(Generic)

AN JUHYUN·2024년 2월 19일

react-native 개발일지

목록 보기
6/15

제네릭이란?

제네릭이란? (Generic)

클래스 또는 함수에서 사용할 타입(Type)을, 그 클래스나 함수를 사용할 때 결정하는 프로그래밍 기법

선언할 때는 타입 파라미터만 적어주고 생성시점에 사용타입을 결정함

function getSize(arr:number[]):number{
	return arr.length;
}

const arr1 = [1,2,3];
getSize(arr1); //3

// 숫자가 아닌 배열을 받으려면???

여러개의 타입을 받는 경우 제네릭을 설정

여러개의 타입을 전달하려는 경우 유니온으로 만들어야함.
너무 유니온타입이 길어질 수 있음

이럴 때 타입파라미터인 제네릭을 설정해줌

function getSize<T>(arr: T[]):number{
	return arr.length;
}

const arr1 = [1,2,3];
getSize<number>(arr1); //3

const arr2 = ['사과','딸기'];
getSize<string>(arr2);

인터페이스에서 제네릭 사용

interface Moblie<T>{
	name: string;
    price: number;
    option: T;
}

// 객체생성
const m1:Moblie<object> = {
// const m1:Moblie<{color:string, coupon:boolean}> = {
	name: 's22',
    price: 200,
    option: {
    	color: 'red',
        coupon: false,
    },
}
const m2:Moblie<string> = {
	name: 's20',
    price: 100,
    option: 'good',
}

인터페이스를 활용하면 여러 객체를 자유롭게 생성할 수 있다.

왜 쓰는지?

코드 재사용 측면에서 유용하다!!

참고) 코딩앙마 typescript 유튜브

profile
frontend developer

0개의 댓글