[TypeScript] 타입스크립트의 타입(Type)과 타입 명시

728x90

타입 명시란 변수를 선언할 때, 변수 값의 타입을 명시하여 변수의 타입을 지정해주는 것을 의미합니다.

이전에 타입추론에서는 변수를 선언할 때 타입을 명시하지 않고 선언만 한 후 이후 초기화를 해줄때 value에 따라서 타입을 추론해주기도 했었습니다.

타입스크립트에서의 Snytax는 아주 간단합니다.

let x: string = "Hello, TypeScript!";

이처럼 변수명 x 앞에는 상수인지 변수인지를 결정하는 let, const 등을 사용하고(var는 거의 사용하지 않습니다) 뒤에 : 콜론과 타입을 명시해주면됩니다.

위의 예시에서는 x에 들어갈 타입은 string(문자열)이고 x에는 string 값만 할당될수 있게 됩니다.

let aaa = 'hello';
let bbb = 123;
let ccc = false;
let ddd = {name: 'cine', age: 20};

위와 같이 타입이 명시되어있지 않은 변수들이 있다고 할때 위의 변수에 타입을 지정해 보겠습니다.

let aaa: string = 'hello';
let bbb: number = 123;
let ccc: boolean = false;
let ddd: object = {name: 'cine', age: 20};

aaa는 'hello'라는 문자열이 들어갔기 때문에 string 타입을,

bbb는 123이라는 숫자가 들어갔기 떄문에 number 타입을,

ccc에는 false라는 값이 들어갔기 때문에 boolean타입을,

ddd는 객체가 들어갔기 때문에 object타입을 명시해주었습니다.

function funcOne(eee) {
	console.log(eee);
}

함수의 경우도 마찬가지입니다.

eee라는 인자에도 타입을 명시해주어야 하며 리턴타입또한 명시할수 있습니다.

function funcOne(eee: number): void {
	console.log(eee);
}

리턴타입을 추론해줄수 있겠지만 리턴타입이 없을경우에는 void를 명시해 주면됩니다.

function funcOne(eee: number): number {
	return eee + 100;
}

이처럼 리턴값이 있을 경우에는 리턴되는 타입을 위와 같이 지정해 줄수 있습니다.

타입스크립트에서는 총 12개의 타입이 존재합니다.

Boolean
Number
String
Object
Array
Tuple
Enum
Any
Void
Null
Undefined
Never

이렇게 12개가 있는데요!

Java와 다르게 타입스크립트는 숫자를 integer나 float등으로 구분하지 않고 number로 사용합니다.

또한 true나 false로 나타내 주는 타입을 boolean타입으로 사용하고 문자열은 모두 string을 사용합니다.

객체 타입은 Object, 배열은 Array를 사용하는데요.

Object의 사용 예시를 한번 볼까요??

Object

const myInfo: object = {
	name: 'cine',
    age: 20,
};

function fff(myInfo: object): string{
	return myInfo['name'];
}

이처럼 오브젝트 타입을 명시할수 있습니다.

Array

Array타입도 조금 생소할수 있는데요.

const ggg: Array<number> = [1, 2, 3, 4, 5];
const hhh: numebr[] = [1, 2, 3, 4, 5];

이렇게 배열을 지정해줄수 있는 타입인데 위와 같이 두가지 방법으로 지정이 가능합니다.

Tuple

튜플은 배열의 길이가 고정되고 각 요소의 타입이 지정되어 있는 배열 형식을 의미합니다.

let iii: [string, number] = ['hello', 10];

조금 독특한 타입인데 위와 같이 사용할수 있습니다.

만약 정의하지 않은 타입, 인덱스로 접근할 경우 오류가 납니다.

iii[1].concat('!'); // Error, 'number' does not have 'concat'
iii[5] = 'hi'; // Error, Property '5' does not exist on type '[string, number]'.

Enum

Enum은 Java와 같은 언어에서 흔히 쓰이는 타입으로 특정 값들의 집합을 의미합니다.

enum color { red, blue, yellow }
let jjj: color = color.red;

이넘은 인덱스 번호로도 접근할 수 있습니다.

enum color { red, blue, yellow }
let jjj: color = color[0];

만약 원한다면 이넘의 인덱스를 사용자 편의로 변경하여 사용할 수도 있습니다.

enum color { red = 2, blue, yellow }
let jjj: color = color[2]; // red
let jjj: color = color[4]; // blue

이처럼 인덱스가 2개 단위로 변화합니다.

Any

any는 어떤 타입도 올수 있다는 의미인데 any를 사용하면 타입스크립트를 사용하는 의미가 사라질수 있기 때문에 실제 코드를 작성하실 때는 any의 사용을 최소화 하는게 좋습니다!

let kkk: any = 10;
kkk = 'hello';

Void

변수에는 undefined와 null만 할당하고, 함수에는 반환 값을 설정할 수 없는 타입입니다.

let unuseful: void = undefined;
function notuse(): void {
  console.log('sth');
}

Never

함수의 끝에 절대 도달하지 않는다는 의미를 지닌 타입입니다.

// 이 함수는 절대 함수의 끝까지 실행되지 않는다는 의미
function neverEnd(): never {
  while (true) {

  }
}