[TypeScript 기본 이론] #1 Basic Types

mechaniccoder·2020년 6월 29일

TypeScript 기본이론

목록 보기

1/6

Boolean

let isDone: boolean = false;

Number

16진수, 10진수, 2진수, 8진수까지 지원한다.

let decimal: number = 6;
let hex: number = 0xf00d;

String

TypeScript에서도 템플릿 문자열을 지원한다.

let name: string = 'seung hwan';
let sentence: string = `hello my name is ${name}`;

Array

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

<1>

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

<2> 제네릭 배열 타입 Array<eleType>

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

Tuple

튜플 타입은 요소의 타입과 개수가 고정된 배열을 말한다. 요소들의 타입이 같을 필요는 없다.

let x: [string, number];
x = ['hello', 5]; // 성공
x = [5, 'hello']; // 에러, 타입의 순서가 맞지 않기 때문이다.

x[3] = 'world'; // 에러, 3이라는 프로퍼티가 없다.

Enum (열거)

기본적으로 enum은 0부터 시작해서 요소들의 번호를 매긴다. 그러나 요소의 값을 수동으로 설정해 바꿀 수도 있다.

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

enum Color {Red = 1, Green, Blue} // 이러면 요소들이 1부터 매겨진다.
let c: Color = Color.Green;

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

// 매겨진 값을 이용해 enum 요소를 부를 수 있다.
enum Color {Red = 1, Green, Blue}
let colorName: string = Color[2];
console.log(colorName); // Green이 출려된다.

Any

타입을 알지 못하는 경우, 컴파일 될 때 검사를 통과시켜야 할 경우에 any 타입을 활용한다.

let notsure: any = 4;
notsure = 'string'; // 성공
notsure = false; // 성공

Object 타입이 비슷한 역할을 하지만 메서드가 존재하더라고 호출할 수 없습니다.

let notsure: any = 4;
notsure.ifItExists(); // 성공

let notsure: Object = 4;
notsure.ifItExists(); // 에러

또한 타입의 일부만 알고 있을 경우에 유용하게 쓸 수 있습니다.

let list: any[] = [1, true, 'free'];

Void

void는 어떤 타입도 존재할 수 없음을 나타내기 때문에, any의 반대 타입과 같아. 보통 함수에서 return 하는 값이 없을 때 반환 타입을 표현하기 위해 사용하지.

function showExample(): void {
  console.log('This is the example of void type');	
}

하지만 void라고 변수에 타입을 선언하는 것은 좋지 않아. 왜냐하면, 그 변수는 null, undefined 만 할당할 수 있기 때문이야.

let unusable: void = undefined;
unusable = null;

Null and Undefined

TypeScript에서 undefined와 null은 각각 자신의 타입 이름으로 undefined와 null을 사용해.

let u: undefined = undefined;
let n: null = null;

그리고 null과 undefined는 다른 모든 타입의 하위타입이야. 이 말은 null과 undefined를 number 혹은 string과 같은 타입의 변수에도 할당할 수 있다는 말이겠지?

그러나, 만약 --strictNullChecks를 사용하고 있다면, null과 undefined는 오직 any, 각자의 타입에만 할당 가능해. (예외적으로 undefined는 void에도 할당 가능하다는 거 알아둬.)

Never

never 타입은 절대로 발생할 수 없는 타입을 나타내. 한마디로 에러 그 자체를 말하는 것 같단 말이지. never 타입은 모든 타입에 할당 가능한 하위 타입이야.

// 이 함수는 중간에 에러를 발생시키는 함수이기 때문에 논리적으로 끝까지 실행되지 않아
따라서 never를 반환하지
function error(message: string): never {
	throw new Error(message);
}

Object

object는 원시타입이 아닌 타입을 나타내. 원시타입에는 number string boolean bigint symbol null undefined 이 있어.

declare function create(o: object | null): void;
create({prop: 0}); // 성공
create(null); // 성공

create(42); //에러
create('string'); // 에러

Type assertions (타입 단언)

타입 단언은 타입을 바꾸는 것과 유사해. 다른 점은 검사를 하거나 데이터를 재구성하지 않아. TypeScript는 개발자가 타입 단언을 함으로써 특정 검사를 수행했다고 생각할거야. 타입 단언하는 방법은 두가지야.

<1> angle-bracket 문법

let someValue: any = 'this is a string';
let strLength: number = (<string>someValue).length;

<2> as 문법

let someValue: any = 'this is a string';
let strLength: number = (someValue as string).length;

TypeScript를 JSX와 함께 사용할 때는 as 타입 단언만 허용되니까 잘 알아두고.

mechaniccoder

세계 최고 수준을 향해 달려가는 개발자입니다.

다음 포스트

[TypeScript 기본 이론] #1 Basic Types