[타입스크립트] TypeScript의 기본 타입 (1)

minidoo·2020년 10월 29일
0

타입스크립트

목록 보기
1/6
post-thumbnail

타입 선언 방법

let 변수명: 타입 = 값;

Boolean

let trueBoolean: boolean = true;
let falseBoolean: boolean = false;

Number

자바스크립트와 타입스크립트는 다른 언어에 비해 타입에 좀 더 자유롭다.
정수, 실수, 진수 등 다양한 숫자 타입을 number 로 선언할 수 있다.

let num: number = 3;
let float: number = 3.2;
let binary: number = 0b1010;
let nan: number = NaN;

String

let str: string = 'TypeScript';
let red: string = 'red;
let color: string = `My color is ${red}`;

Array

array 는 두 가지 방식으로 선언 가능하다.

let arr1: string[] = ['a', 'b', 'c'];
let arr2: Array<string> = ['a', 'b', 'c'];
let fruit1: string[] = ['apple', 'orange', 'melon'];
let fruit2: Array<string> = ['apple', 'orange', 'melon'];

let num1: number[] = [1, 2, 3, 4, 5];
let num2: Array<number> = [1, 2, 3, 4, 5];

let arr1 = (string | number)[] = ['apple', 'orange', 1, 2, 3];
let arr2 = Array<string | number> = ['apple', 'orange', 1, 2, 3];

읽기 전용 Array

읽기 전용 배열 앞에는 readonlyReadonlyArray<> 를 써준다.
오직 읽기만 가능하여 새로운 값을 넣거나 빼는 것을 할 수 없다.

let arrA: readonly number[] = [1, 2, 3, 4, 5];
let arrB: ReadonlyArray<number> = [1, 2, 3, 4, 5];

arrA.push(6); 	// Property 'push' does not exist on type 'readonly number[]'

Tuple

Tuple 은 정해진 타입의 고정된 길이 배열을 표현한다.
튜플도 배열과 마찬가지로 읽기 전용을 만들 수 있다.

let tuple1: [string, number, boolean] = ['tuple', 12, true];
let tuple2: [string, number][] = [['a', 1], ['b', 2], ['c', 3]];
let tuple3: readonly [string, number, boolean] = ['tuple', 12, true];

Enum

Enum (열거형)은 숫자 혹은 문자열 값 집합에 이름(Member)을 부여할 수 있다.

enum Week {
  Sun, Mon, Tue, Wed, Thu, Fri, Sat
}

console.log(Week.Mon);		// 1
console.log(Week.Tue);		// 2
console.log(Week['Wed']);	// 3
console.log(Week[4]);		// Thu
enum Week {
  Sun, Mon, Tue = 22, Wed, Thu, Fri, Sat
}

console.log(Week.Mon);		// 1
console.log(Week.Tue);		// 22
console.log(Week['Wed']);	// 23

두 예시는 역방향 매핑(Mapping)을 지원한다.
Week.Mon 처럼 문자열을 통해 숫자 값을 얻을 수도 있고, Week[4] 처럼 숫자를 통해 문자열 값을 얻을 수도 있다.

문자열에 특정 값을 지정하고 선언한 경우에는 역방향 매핑을 지원하지 않는다.

enum Color {
  Red = 'red',
  Green = 'green',
  Blue = 'blue'
}

console.log(Color.Red);		// red
console.log(Color['Green']);	// green
console.log(Color['blue']);	// Property 'blue' does not exist on type 'typeof Color'...

참고 사이트

https://heropy.blog/2020/01/27/typescript/

0개의 댓글