[TS] 타입스크립트(TypeScript)란?

 

타입스크립트란?

타입스크립트는 자바스크립트에 타입을 부여한 언어로, 자바스크립트 확장된 언어

타입스크립트 설치 없이 사용하기: playground

TS Playground - An online editor for exploring TypeScript and JavaScript

 

타입스크립트 왜 쓸까?

자바스크립트의 동적타입을 정적으로 선언이 가능하며 컴파일 시점에 오류를 포착할 수 있다.

또한, 타입 추론(타입 유추)을 제공하기 때문에 자바스크립트로 작성된 코드도 어느 정도 타입 제어가 가능하다.

function sum(a, b) {
  return a + b
}

sum(1, '2') //12

위와 같이 두 수의 합을 구하는 함수 sum에서 number 1과 string '2'를 넘겨줘도 에러가 나지 않고 1과 '2'를 합한 12가 반환된다.

자바스크립트는 타입을 사전에 지정하지 않는 동적 타입 언어이기 때문에 에러가 나지 않는다.

 

function sum(a: number, b: number) {
  return a + b
}

sum(1, '2')
// Argument of type 'string' is not assignable to parameter of type 'number'.ts(2345)

타입스크립트에선 함수의 매개변수에 타입을 number로 지정해줬기 때문에 number 외에 타입을 할당하려고 하면 에러가 나는 걸 바로 확인할 수 있다.

 

타입스크립트 기본 타입

기본 자료형 (primitive type)

let str:string = 'hi';

• string: 문자열

let num: number = 7;

• number: 숫자

let right: boolean = true;

• Boolean: 참 / 거짓

• null: 의도적으로 비어있는 값
• undefined: 아무 값이 할당되지 않은 상태

 

참조 자료형 (reference type)

let intro: { age: number } = { age: 20 }

• object: 기본 자료형 외의 타입

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

• array: 배열

 

추가 제공 자료형

let arr: [string, number]
arr = ['b', 1];

• tuple: 길이와 각 요소의 타입이 정해진 배열

 

enum animals {
    dog,
    cat,
    rabbit
}

let dog: animals = animals.dog;
let dog: animals = animals[0]; //인덱스로 접근 가능

• enum: 특정 값들의 집합

 

function create(): void{}

• void: 결과 값을 반환하지 않는 함수 타입

 

function showErr(): never{
    throw new Error();
}

• never: 항상 오류를 발생시키거나 반환이 없는 함수 타입

 

• any: 알지 못하는 타입을 표현해야 할 때 사용하며 모든 타입을 저장 가능

 

Refernece

• 엘리스