Typescript 및 해당 키워드 "type"

당연히 Typescript는 객체 지향 개념을 Javascript 언어로 가져온 상위 집합입니다. 그러나 Microsoft에서 만든 이 언어의 일부 키워드는 여전히 의심을 불러일으킵니다.

클래스를 통한 엔티티 및 가치 객체 모델링 외에도 인터페이스 또는 유형을 사용하여 이러한 모델링을 수행할 수도 있습니다. 다음은 각 언어의 특징을 이용한 모델링의 예이다.

class People {
    name: string;
    age: number;
}

interface People {
    name: string;
    age: number;
}

type People = {
    name: string;
    age: number;
}

이 시점에서 "세 가지 방법 중 하나로 모델링이 가능하다면 왜 '유형'을 사용하거나 이해해야 합니까?"라고 생각할 수 있습니다. 대답은 간단합니다. 유형 리소스의 사용만 허용하는 용도가 있습니다. 아래에서 이러한 각 시나리오에 대해 자세히 설명합니다.

유형 별칭

이름에서 알 수 있듯이 클래스, 인터페이스, 다른 유형 또는 기본 유형으로 선언되었는지 여부에 관계없이 이미 존재하는 유형에 새 이름을 부여하는 별명이 가능합니다.

type Student = People;

type Guid = string;

위의 예에서 기본적으로 "Person"모델의 별칭인 "Student"라는 유형을 만들었습니다. Typescript에는 Guid 유형(C#처럼)이 없기 때문에 문자열 유형에 매핑된 고유 식별자에 대한 유형도 생성했습니다.

기존 유형, 특히 기본 유형의 별칭 지정은 해당 유형이 사용될 컨텍스트와 일치하는 시맨틱을 가져오는 데 유용합니다. 문자열 유형 식별자는 이름에 이미 형식이 있는 GUID 유형과 달리 ID의 형식이나 값에 대한 단서를 제공하지 않습니다.

템플릿 리터럴

이것은 열거 가능한 하나 이상의 정적 값에 별칭을 지정하는 데 이상적인 기능입니다. 이해하지 못했다? 예를 들어 보겠습니다.

type MonthNumber = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;

위는 해당 연도의 각 월별 지수입니다. 리터럴 유형을 사용하는 이점은 아래 예와 같이 잘못된 값, 즉 정의된 집합에 속하지 않는 값이 사용될 때 경고된다는 것입니다.

조합 유형

요컨대, 여러 다른 유형(프리미티브, 클래스, 인터페이스, 유형, 리터럴)을 허용하는 유형, 즉 다른 유형을 통합하는 유형을 선언할 수 있습니다.

아래에서 문자열 값(예: GUID인 경우)과 숫자 유형(예: 자동 증분 정수인 경우)을 모두 허용하는 ID 유형을 만듭니다.

type ID = string | number;

const peopleId: ID = 13;

const postId: ID = '08288a85-b79b-4022-a0dd-1563bd0f5de1';

교차점 유형

여러 유형을 새 유형에 대해 유효한 것으로 허용하는 것 외에도 여러 유형을 병합하여 둘 이상의 다른 유형의 속성을 융합한 유형을 만드는 것도 가능합니다. 이 사용 시나리오는 엔터티 선언으로 제한되며 기본 값에는 적용되지 않습니다.

아래 예에서는 엔터티(Person)와 값 개체(Address)를 만듭니다. "&"연산자를 사용하여 두 가지 유형을 주소가 있는 사람을 나타내는 엔터티인 새 유형으로 통합할 수 있었습니다. 이 세 번째 유형은 그것을 발생시킨 두 유형의 모든 속성을 포함합니다.

class People {
    name: string;
    age: number;
    id: ID;
}

interface Address {
    country: string;
    city: string;
}

type PeopleWithAddress = People & Address;

const george: PeopleWithAddress = {
    age: 19,
    city: 'Serra',
    country: 'BR',
    id: 25,
    name: 'George',
    zipCode: 251475899
};

최종 고려 사항

이러한 기능을 사용하면 더 이상 문자열이나 숫자와 같은 값을 코드 주변에 흩뿌리거나 한 모델의 모든 속성을 다른 모델에 반복할 변명이 없습니다. 값의 개발 시간 유효성 검사를 수행하고 템플릿 선언 라인을 저장할 수 있습니다. :)

폰테스:
Types aliases
Literal types
Union types
Intersection types