TypeScript Guidebook
  • TypeScript 가이드북
  • 소개
    • TypeScript를 사용하는 이유
  • 환경 구성 / CLI
    • 컴파일 설정
    • 린팅
    • IDE / 에디터
    • Google TypeScript Style
    • TSDX
  • 타입
    • primitive 타입
    • any 타입
    • array 타입
    • tuple 타입
    • enum 타입
    • function / union / void 타입
    • object 타입
    • null / undefined 타입
    • never 타입
    • 사용자 정의 타입
    • 타입 어설션
  • TS vs ES6
    • 블록 영역 변수, 상수 선언
    • 템플릿 리터럴
    • 화살표 함수
    • 전개 연산자 / 매개변수
    • 비구조화 할당
  • 클래스
    • 속성 with 접근 제어자
    • 메서드 with 접근 제어자
    • 상속
    • 게터 / 세터
    • 스태틱 속성, 메서드
    • 추상 클래스
    • 싱글턴
    • 읽기전용 속성
  • 네임스페이스와 모듈
    • 네임스페이스
    • 네임스페이스 멀티 파일
    • 네임스페이스 중첩
    • 모듈
    • 모듈 번들링
  • 인터페이스
    • 인터페이스와 클래스
    • 인터페이스와 매개변수
    • 인터페이스와 객체 리터럴
    • 인터페이스 옵션 속성
    • 인터페이스 읽기 전용 속성
    • 인덱스 시그니처 속성
    • 인터페이스와 함수타입
    • 인터페이스 확장
  • 제네릭
    • 제네릭과 클래스
    • 제네릭과 함수
    • 멀티 타입 설정
    • 타입 변수 상속
  • 데코레이터
    • 데코레이터 / 팩토리
    • 데코레이터 구성
    • 클래스 데코레이터
    • 메서드 데코레이터
    • 접근 제어자 데코레이터
    • 속성 데코레이터
    • 매개변수 데코레이터
Powered by GitBook
On this page
  • 함수 + 멀티 타입
  • 팩토리 함수 + 멀티 타입
  • 실습
  • 참고
  1. 제네릭

멀티 타입 설정

함수 + 멀티 타입

함수 또는 클래스에서 멀티 타입 변수를 활용할 수 있습니다. 배열 내부에 사용자가 지정한 멀티 타입을 포함하는 배열을 추가하는 함수를 만든다면 TypeScript 멀티 타입 변수를 사용하여 다음과 같이 작성할 수 있습니다.

// pairArray 사용자 정의 타입(Type Alias) 정의
type pairArray = [any, any][];

// 멀티 타입 T, M 설정된 함수 pushPairItem 정의
function pushPairItem<T,M>(arr:pairArray, item:[T,M]):pairArray {
  arr.push(item);
  return arr;
}

// piarArray 타입으로 설정된 data 배열 선언
const data:pairArray = [];

// 멀티 타입을 지정한 후, 적절한 타입을 포함하는 데이터 추가
pushPairItem<boolean, string>(data, [false, 'false']);
pushPairItem<number, string>(data, [2019, '이천십구년']);

T, M 등 타입 변수 이름은 사용자가 임의로 지정하는 것입니다. 반복문의 i, j 변수와 유사하다고 생각하면 이해하기 쉽습니다.

팩토리 함수 + 멀티 타입

클래스와 옵션을 멀티 타입으로 설정하여 처리하는 팩토리 함수가 있다고 가정해봅시다. 눈여겨 볼 부분은 클래스를 전달 받을 때 타입을 어떻게 설정해야 하는가 입니다.

// 클래스 Model
class Model {
  constructor(public options:any) {}
}

// 팩토리 함수
function create<T, U>( C: {new (U): T}, options: U ):T {
  return new C(options);
}
​
// create() 팩토리 함수에 Model, string[] 멀티 타입 설정
create<Model, string[]>(Model, ['class type']);

C: {new (U): T} 표현에서 new ()는 외부에서 전달된 생성자 함수 또는 클래스를 나타냅니다. 중괄호로 묶는 표현 대신, =>를 사용하는 표현도 가능합니다.

C: new (U) => T

즉, create() 팩토리 함수는 다음과 같이 작성할 수도 있습니다.

function create<T, U>(C: new(U)=>T, options: U): T {
  return new C(options);
}

실습

참고

Previous제네릭과 함수Next타입 변수 상속

Last updated 6 years ago

Handbook - Genericstypescriptlang
TypeScript - 제네릭 클래스 타입
Logo