[TypeScript] 기본 타입

TypeScript 의 기본 타입에는 boolean, number, string, array, tuple, enum, any, void, null, undefined, never, object 등이 있습니다. 이에 대해 하나씩 예시와 함께 살펴보겠습니다.

불린(Boolean)

true 혹은 false 값을 나타냅니다.

let isExist:boolean = false;

숫자(Number)

TypeScript의 모든 숫자는 부동 소수 값입니다. 16진수, 10진수 리터럴에 더불어 2진수, 8진수 리터럴도 지원합니다.

// 10진수 리터럴
let decimal: number = 3;
// 16진수 리터럴
let hex: number = 0xf00d;
// 2진수 리터럴
let binary: number = 0b1010;
// 8진수 리터럴
let octal: number = 0o744;

console.log(decimal); // 3
console.log(hex); // 61453
console.log(binary); // 10
console.log(octal); // 484

문자열(String)

TypeScript에서는 텍스트 데이터 타입을 string 으로 표현합니다. 큰따옴표(") 나 작은따옴표(') 를 문자열 데이터를 감싸는데 사용합니다.

let fruit: string = "apple";
fruit = "orange";

템플릿 문자열(백틱/백쿼트(`) 문자)을 사용하면 여러 줄에 걸쳐 문자열을 작성할 수 있으며, 표현식을 포함시킬 수도 있습니다.

let fullName: string = `Ron Park`;
let age: number = 27;
let introduction: string = `Hello, my name is ${fullName}
I'll be ${age + 1} years old next year.`;

배열(Array)

배열 타입은 두 가지 방법으로 쓸 수 있습니다.

1. 배열 요소들을 나타내는 타입 뒤에 [ ] 를 쓰는 것입니다.

let numList: number[] = [1, 2, 3];

2. 제네릭 배열 타입을 쓰는 것입니다. Array<elementType>

let numList: Array<number> = [1, 2, 3];

튜플(Tuple)

튜플 타입을 사용하면 요소의 타입과 개수가 고정된 배열을 표현할 수 있습니다.

다만 모든 요소의 타입이 같을 필요는 없습니다.

// 튜플 타입으로 선언
let tuple: [string, number];
// 초기화
tuple = ["introduce", 20];
// 잘못된 초기화
tuple = [20, "introduce"]; // 오류 발생

정해진 인덱스에 위치한 요소에 접근하면 해당 타입이 나타냅니다.

console.log(tuple[0].substring(1)); // "ntroduce"
console.log(tuple[1].substring(1)); // 오류 발생, number 타입에는 substring 메서드가 정의되어 있지 않습니다.

정해진 인덱스 외에 다른 인덱스에 있는 요소에 접근하면, 오류가 발생하며 실패합니다.

tuple[3] = "hello"; // 오류, '[string, number]' 타입에는 프로퍼티 '3'이 없습니다.

console.log(tuple[4].toString()); // '[string, number]' 타입에는 프로퍼티 '5'가 없습니다.

열거(Enum)

enum 은 관련 값 모음을 구성하는 방법이며 값의 집합에 이름을 붙여줄 수 있습니다.

enum Color {Red, Green, Blue}
let c: Color = Color.Green;

기본적으로, enum은 0부터 시작해 멤버들의 번호를 매깁니다. 아래와 같이 0 대신 1부터 시작해 번호를 매기도록 바꿀 수 있습니다.

enum Color {Red=1, Green, Blue}
let c: Color = Color.Green;

enum은 매겨진 값을 사용해 enum 멤버의 이름을 알아낼 수 있습니다.

enum Color {Red = 1, Green = 2, Blue = 4}
let colorName: string = Color[2];

console.log(colorName); // 'Green'

enum은 함수 파라미터나 리턴 타입으로 사용될 수 있습니다.

enum PrintMedia {
  Newspaper = 1, 
  Newsletter,
  Magazine,
  Book
}

function getMedia(mediaName: string): PrintMedia {
  if (mediaName === 'Forbes' || mediaName === 'Outlook') {
    return PrintMedia.Magazine;
  }
}

let mediaType: PrintMedia = getMedia("Forbes"); // returns Magazine

Any

어플리케이션을 만들 때, 알지 못하는 타입을 표현해야 할 수도 있습니다.

사용자로부터 받은 데이터나 서드 파티 라이브러리 같은 동적 컨텐츠의 경우 타입 검사를 하지 않고, 그 값들이 컴파일 시간에 검사를 통과하길 원할 때 사용할 수 있습니다.

let apiData: any = 4;
apiData = "it is apiData";
apiData = { title: "title01", content: "content01" };

 

 

any 타입은 타입의 일부만 알고 전체를 알지 못할 때 유용합니다.

// 여러 다른 타입이 섞인 배열을 다루는 경우
let arr: any[] = ["Ron", 216, true];
arr.push("Smith");
console.log(arr); // ["Ron", 216, true, "Smith"]

Void

void는 어떤 타입도 존재할 수 없음을 나타냅니다. 보통 함수에서 반환 값이 없을 때 반환 타입을 표현하기 위해 사용됩니다.

function sendError(): void {
  console.log("This is error message");
}

void 타입의 변수에는 null 또는 undefined 만 할당할 수 있습니다.

let useless: void = undefined;
useless = null; // --strictNullChecks 를 사용하지 않을 때만 할당 가능

Null and Undefined

// 이 밖에 이 변수들에 할당할 수 있는 값이 없습니다.
let u: undefined = undefined;
let n: null = null;

기본적으로 null과 undefined는 다른 모든 타입의 하위 타입이므로 number 같은 타입에 할당할 수 있습니다.

하지만, --strictNullChecks를 사용하면 null과 undefined는 오직 any와 각자 자신들 타입에만 할당 가능합니다.

Never

never 타입은 절대 발생할 수 없는 타입을 나타냅니다.

never는 함수 표현식이나 화살표 함수 표현식에서 항상 오류를 발생시키거나 절대 반환하지 않는 반환 타입으로 사용됩니다.

function throwError(errorMsg: string): never {
  throw new Error(errorMsg);
}

function keepProcessing(): never {
  while (true) {
    console.log("I always do something and never ends.");
  }
}

never 와 void 의 차이점

void 타입은 null 과 undefined 를 값으로 가질 수 있지만 never 타입은 어떤 값도 가질 수 없습니다.

let something: void = null;
let nothing: never = null; // Error: Type 'null' is not assignable to type 'never'

객체(Object)

object는 원시 타입이 아닌 타입을 나타냅니다.

number, string, boolean, bigint, symbol, null 또는 undefined 가 아닌 나머지를 의미합니다.

declare function create(o: object | null): void;

create({ prop: "value" });
create(null);

create(30); // 오류
create("string"); // 오류
create(true); // 오류
create(undefined); // 오류

출처

https://www.tutorialsteacher.com/typescript/typescript-tuple 

TypeScript - Tuples

https://typescript-kr.github.io/pages/basic-types.html