WIL : 23.05.21(1)

23.05.04~ / TypeScript Study_Class, Generic

Class

접근제한자 (대표적 3가지)

• public : 자식 클래스, 클래스 인스턴스 모두 접근 가능하며 생략가능하다. (default)
• private : 해당 클래스 내부에서만 접근 가능
  일반적으로는 private "ClassName" 으로 작성하며, #ClassName으로도 작성가능
• protected : 자식 클래스에서 접근 가능

static Class

정적 멤버변수나 메서드의 경우 this가 아닌 클래스 명으로 호출한다.

추상 Class

: abstract로 class를 선언할 수 있으며 new를 통해 새로운 클래스객체룰 선언할 수 는 없다.
: 상속을 통해서만 사용가능하다.(class NAME1 extends NAME2)

Generic

다음과 같은 코드가 있다.

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

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

const arr2=["a", "b", "c"];
getSize(arr2); //3


const arr3=[true, false, true];
getSize(arr3); //3

이때, arr1, arr2, arr3에 대한 각각의 타입을 지정하기 위해 getSize(arr:number[] | string[] | boolean[]) 로 작성하였다. 이렇게 함수가 다수의 타입을 가져야할때 각각의 타입을 명시해주기보단 다음과 같이 제너릭타입으로 작성할 수 있다.

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

이때 통상적으로 알파벳 T를 사용하고 있으며, TypeParameter라고 부른다 (T가 아니라 A, B여도 상관없다)

제너릭타입중 특정타입을 강조하고 싶다면 다음과 같이 사용하고자 하는 변수 앞에 타입을 명시해주면 된다.

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

제너릭타입은 코드 재사용측면에서 용이하게 사용될 수 있다.

예제1
다음 interface의 option을 제너릭타입을 사용해 재정의해보고, 선언해보자.

interface Mobile{
    name : string;
    price : number;
    option : any;
}

정답

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

const m1: Mobile<string> ={
    name : "name",
    price : 123,
    option : "123",
}

const m2: Mobile<{color:string; coupon:boolean}> = {
    name : "name",
    price : 123,
    option : {
        color:"red",
        coupon : false
    },
}

예제2
제너릭타입을 확장해서 사용해보자.