[TS] Type (any, void, enum, union, tuple)

zhflsdl보보·2022년 12월 20일
0

TypeScript

목록 보기
1/3

Any

어떤 타입이나 지정 가능
아무 타입도 지정하지 않은 JS와 동일하므로 사용을 지양하자

let value: any;

value = 'kim';
value = 1234;
value = [1,2,3,4]; // 전부 error 없음

Void

어떤 타입도 없다. return 되는 값이 없을 때 사용

function clickButton(): void {
	alert ('Clicked!');
}

Enum

열거형으로 특정값이 주어진다.

enum Category {
	Pasta,
    Pizza,
    Dessert
}

let menuCategory: Category = Category.Pasta // 0
let menuCategory: Category = Category.Pizza // 1
let menuCategory: Category = Category.Dessert // 2

// 특정값을 할당할 수도 있다.

enum Category {
  	Pasta = 'pasta',
    Pizza = 'pizza',
    Dessert = 'dessert'
}

Union

여러 타입이 올 수 있을 때 사용, | 사용해서 표현

let age: number | string;

age = 10;
age = '15';

// 주로 문자열 리터럴에서 사용

type Color = "Red" | "Black" | "White";

let color: Color;
color = "Red";
color = "Yellow"; // error 발생

Tuple

배열에 두개 이상의 타입을 사용하고 싶을 때
배열의 각 항목의 타입을 미리 지정 + 순서도 고정

// in JS
let role = ["a", "b", 40];

// in TS
let role: string[] | number[] = ["a", "b", 40];
// Tuple을 사용하면,
let role: [string, string, number] = ["a", "b", 40];

튜플의 장점
사용자의 정보를 담는다고 할 때, 규칙을 모르는 개발자가 순서를 바꿔서 배열을 만들려고 하면 오류를 발생시킬 수 있다.

const userInfo1 = [1, 'user1@naver.com', 'qwer', 970908, true];
const userInfo2 = [2, 'user2@naver.com', 'asdf', 890716, false];
const userInfo3 = [3, 'user3@naver.com', 'rtty', 930413, false];

const userInfo4 = ['uiop', 4, true, 840902, 'user4@naver.com']; // error

튜플의 단점
배열이기 때문에 메서드인 push를 사용하면 배열의 길이가 늘어나게 된다.
튜플의 목적인 배열 인덱스마다 타입과 순서를 완벽히 고정할 수 없다.
이를 해결하기 위해 readonly 를 사용할 수 있다.

type UserInfo = [number , string , string , string , boolean];
let userInfo1 : UserInfo = [1, 'user1@example.com' , 'abcd123' , '1999-01-01' , true];
userInfo1.push('hello'); // push로 string 타입인 'hello' 추가

console.log(userInfo1); // (6) [1, 'user1@example.com', 'abcd123', '1999-01-01', true, 'hello']


// readonly 적용

type UserInfo = readonly [number , string, string ,string , boolean];
let userInfo1 : UserInfo = [1, 'user1@example.com' , 'abcd123' , '1999-01-01' , true];

userInfo1.push('hello'); // Error

union vs tuple
union은 사용하고자 하는 타입 중에 하나만 있어도 가능하다.
tuple은 정의한 타입이 모두 존재해야 한다.

profile
매일매일 성장하는 개발자

0개의 댓글