[TypeScript] 타입스크립트와 타입 선언

타입스크립트와 타입

타입스크립트는 모든 변수, 함수의 파라미터나 리턴타입, 오브젝트(Object), 클래스(class) 등에 대하여 타입을 설정할 수 있다. 말 그대로 Java와 같은 프로그래밍 언어에서 자료형을 정하는 것과 같습니다.

 

 

타입스크립트의 타입 추가

타입스크립트는 자바스크립트 변수 등에 타입(like 자료형)을 추가할 수 있습니다.

 

// 자바스크립트 변수에 타입을 추가하기
let someVariable1: number = 123;
let someVariable2: string = "hello";
let someVariable3: boolean = true;

// let someVariable4: number = "123"; // 오류!

 

타입스크립트는 타입과 다른 값이 변수에 할당되려 하면 아래와 같이 컴파일 오류를 발생시킵니다. 

 

타입스크립트의 타입 선언

타입스크립트는 개발자가 원하는 대로 타입을 만들 수 있습니다.

가령 숫자 또는 문자를 받는 변수의 타입을 만들고 싶다면 아래와 같이 선언하면 됩니다.

 

// 나만의 타입 만들기
type MyType1 = number | string;

let myVariable1: MyType1 = 123;
let myVariable2: MyType1 = "123";
// let myVariable3: MyType1 = true; // 오류!

 

직접 만든 MyType1 타입도 타입이 맞지 않다면 아래의 그림처럼 오류를 발생시켜줍니다.

 

위에서 작성한 예시 코드에서 새로운 타입을 선언했을 때  | 연산자를 사용했는데요.

타입스크립트에서 이 연산자를 사용해 만든 타입을 Union Type이라고 부릅니다.

 

any와 unkown

타입스크립트에서는 자바스크립트에서 사용하는 여러 가지 자료형(클래스, 오브젝트 등)을 타입으로 지원하는데요.

이외에도 any와 unknown 이라는 타입을 지원합니다. 이 두 타입은 어떤 자료형이든 모두 가능하다는 점은 같지만, any  타입스크립트의 타입체크 조차도 전혀 하지 않겠다는 의미입니다. 반면 unknown의 경우 런타임에 오류가 발생할 수 있는 length와 같은 프로퍼티를 출력하거나 연산하는 것이 제한될 수 있습니다.

 

// any
let someVariable5: any = true;
someVariable5 = 123;
someVariable5.length;

// unknown
let someVariable6: unknown = true;
someVariable6 = 123;
// someVariable6.length; // 오류 !

 

type alias

앞선 예제에서 타입을 type 키워드를 통해 별도의 변수처럼 선언하여 사용했는데요. 이렇게 개발자가 직접 선언한 타입을 별도로 type alias라고 부르며, 새로운 타입을 만들거나 재사용의 여지가 있는 타입을 미리 선언하고 사용하는데 사용됩니다.