개발일지

제네릭 본문

typescript

제네릭

eodovo 2022. 11. 3. 15:05
728x90

제네릭은 특정 타입을 이용해서 템플릿처럼 함수를 만들 수 있다

 

function getSize<T>(arr:T[]):number{ //<타입파라미터>는 통일해야한다.
    return arr.length;
}

const arr=[1,2,3];
console.log(getSize<number>(arr));

const arr2 =['a','b','c','d','e'];
console.log(getSize<string>(arr2));

const arr3 = [true,false,false,true];
console.log(getSize<Boolean>(arr3));

제네릭(Generics) 사용 - function 함수명<타입파라미터>(매개변수:타입파라미터):타입{}

<타입파라미터>는 아무 값이나 가능

interface Mobile<T>{ //제네릭 <T>사용
    name :string;
    price:number;
    option:T //제네릭 <T>사용
}

const obj1 : Mobile <{color:string; coupon:boolean}> ={
    name: '삼성 s20',
    price :100,
    option :{
        color: 'red',
        coupon : false
    }
}

console.log(obj1.name ,obj1.price +'만원','색상:'+obj1.option.color,'쿠폰:'+obj1.option.coupon)


const obj2: Mobile<string> ={
    name: '삼성 s22',
    price: 120,
    option: 'android OS'
};
console.log(obj2.name , obj2.price +'만원', obj2.option);

제네릭이란 타입을 마치 함수의 파라미터처럼 사용하는 것을 의미

'typescript' 카테고리의 다른 글

TS + React /스타일드 컴포넌트 props를 이용한 가변 UI 만들기  (0) 2023.01.24
클래스 (class)  (0) 2022.11.03
리터럴 , 유니온, 교차타입  (0) 2022.11.03
타입 스크립트 함수  (0) 2022.11.03
타입 스크립트  (0) 2022.11.02
Comments