타입스크립트에서 타입을 정의하는 다양한 방법들에 대해 알아보겠습니다.

Type Alias

Type Alias는 사용자가 직접 새로운 타입을 정의할 수 있습니다. type 키워드를 통해 다양한 타입을 생성할 수 있습니다.

type Name = string;
const name:Name = '홍길동';

원시 타입말고도 object형 타입도 정의해서 사용할 수 있습니다.

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

const student: Student = {
	name: '홍길동',
  	age: 20
}

String Literal Types

원시 타입, 객체 타입 말고도 문자열을 타입으로 지정해서 사용할 수 있습니다. 해당 타입을 가진 변수는 정의한 문자열만 담을 수 있습니다.

type Name = '홍길동';
let student: Name;

student = '다른이름'; //에러

type JSON = 'json';
const json: JSON = 'json';

Union Types

Union Types는 OR의 개념으로, | 키워드를 이용하여 여러 타입을 묶어서 정의할 수 있습니다. 해당 타입을 사용하면 정의한 타입에 해당하는 값만 할당할 수 있습니다.

type Direction = 'left' | 'right' | 'up' | 'down';

function move(direction: Direction) {
	...
}
    
move('up');

type Size = 4 | 8 | 16;

const width: Size = 8;

type SuccessState = {
	response: {
    	body: string;
    }
}

type FailState = {
	reason: string; 
}

type LoginState = SuccessState | FailState;

function login(): LoginState {
	return {
        response: {
          body: '로그인 성공';
      	}
    }
}

Discriminated Union

Union을 이용하여 타입 정의 시, 여러개의 정의된 타입을 구별해야 할 경우가 있습니다. 타입들간의 공통적인 속성을 정의해두고 쓰면 구분이 편리해집니다.

type SuccessState = {
  	result: 'success';
	response: {
    	body: string;
    };
}

type FailState = {
  	result: 'fail';
	reason: string; 
}

type LoginState = SuccessState | FailState;

function login(): LoginState {
	return {
      	result: 'success',
        response: {
          body: '로그인 성공',
      	}
    }
}

function print(state: LoginState) {
    if(state.result === 'success'){
      console.log(state.response.body);
    }else{
      console.log(state.reason);
    }
}

Intersection Types

Intersection Types는 AND의 개념으로, & 키워드를 이용하여 여러 타입을 묶어서 함께 사용할 수 있습니다. 해당 타입으로 정의하면 여러 타입의 모든 속성에 접근 가능합니다. 그러기 위해서는 모든 속성을 정의한 값을 사용해야 합니다.

type Student = {
	name: string;
  	score: number;
};

type Worker = {
	id: number;
  	work: () => void;
};

function internWork(person: Student & Worker) {
	console.log(person.name);
  	console.log(person.score);
  	console.log(person.id);
  	console.log(person.work());
};

internWork({
	name: '홍길동';
  	score: 90;
	id: 1;
  	work: () => {};
});