TypeScript 1 : Basic Types

jeanbaek·2020년 11월 29일
2

TIL (Today I Learned)

목록 보기
53/106

기업협업 중인 회사의 사수 분께 조언을 얻고, 타입스크립트 핸드북으로 타입스크립트 공부를 하려고 한다.

지금 진행하고 있는 프로젝트에서 타입스크립트를 조금이나마 알고 쓰기 위해서는 Basic Types, Interfaces, Generic 순으로 공부하는 게 도움이 될 것 같다.


TypeScript

TypeScript는 JavaScript와 거의 동일한 데이터 타입을 지원하며, 열거 타입을 사용하여 더 편리하게 사용할 수 있다.
(출처: 타입스크립트 핸드북)


Basic Types

Boolean

가장 기본적인 데이터 타입은 boolean이다.

let isDone: boolean = false;

Number

TypeScript의 모든 숫자는 부동 소수 값이다. (JavaScript와 동일)
부동 소수에는 Number 타입이 붙여지며, 2, 8, 10, 16진수 리터럴을 지원한다.

let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;

String

문자열 데이터는 큰따옴표 " 혹은 작은따옴표 '로 감싼다.

let color: string = "blue";
color = 'red';

Array

배열은 두 가지 방법으로 작성할 수 있다.

1. 배열요소의 타입 뒤에 []를 붙인다.

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

2. 제네릭 배열 타입을 작성한다. Array<elemType>

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

Tuple

요소의 타입과 개수가 고정된 배열을 표현할 수 있다.

// 튜플 타입으로 선언
let x: [string, number];
// 초기화
x = ["hello", 10]; // 성공
// 잘못된 초기화
x = [10, "hello"]; // 오류

Enum

Enum은 값의 집합에 더 나은 이름을 붙여줄 수 있다.

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

또한, 요소에 0부터 시작하는 번호를 붙여줄 수 있다.
요소에 수동으로 번호값을 설정할 수도 있다.

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

Any

알지 못하는 타입을 표현해야할 때나, 타입을 검사하지 않고 컴파일 때 검사를 통과하길 원할 때 사용할 수 있다.

타입의 일부만 알기 때문에 전체를 알지는 못할 때 유용하게 사용할 수 있다.

Void

Any의 반대타입이다. 어떤 타입도 존재할 수 없음을 나타낼 때 사용한다. 함수에서 반환 값이 없을 때, 반환 타입을 표현하기 위해 사용된다.

Null and Undefined

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

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

Never

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

never타입은 모든 타입에 할당 가능한 하위 타입이다.

// never를 반환하는 함수는 함수의 마지막에 도달할 수 없다.
function error(message: string): never {
    throw new Error(message);
}

// 반환 타입이 never로 추론된다.
function fail() {
    return error("Something failed");
}

// never를 반환하는 함수는 함수의 마지막에 도달할 수 없다.
function infiniteLoop(): never {
    while (true) {
    }
}

Object

object 타입을 쓰면, Object.create 같은 API 가 더 잘 나타난다.

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

create({ prop: 0 }); // 성공
create(null); // 성공

create(42); // 오류
create("string"); // 오류
create(false); // 오류
create(undefined); // 오류

Type assertions (타입 단언)

TypeScript보다 개발자가 값에 대해 더 잘 알고 있을 때 사용한다. 컴파일러에 영향을 미치며, 런타임에는 아무런 영향이 없다.

타입 단언은 두 가지 형태로 작성할 수 있다.
(TypeScript를 JSX와 함께 사용할 때는 As 문법만 허용된다!)

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;
profile
💡 Software Engineer - F.E

0개의 댓글