[TypeScript] getting started

타입스크립트란?

타입스크립트는 자바스크립트에 타입을 부여한 언어입니다. 자바스크립트의 확장된 언어라고 볼 수 있습니다. 타입스크립트는 자바스크립트와 달리 브라우저에서 실행하려면 파일을 한번 변환해주어야 합니다. 이 변환 과정을 우리는 컴파일(complile) 이라고 부릅니다.

왜 타입스크립트를 써야할까요?

자바스크립트도 충분히 복잡하고 어려운데 왜 또 다른 언어를 배워야 할까요? 단지 최신 기술이라서? 혹은 다른 회사도 많이 사용하니까 우리도 써야 하는 걸까? 라는 고민을 하게 됩니다. 타입스크립트는 아래 2가지 관점에서 자바스크립트 코드의 품질과 개발 생산성을 높일 수 있습니다.

• 에러의 사전 방지
• 코드 가이드 및 자동 완성(개발 생산성 향상)

환경 설정

1. grobal 영역의 TypeScript 설치

npm install -global typescript
yarn global add typescript

2. tsc 명령어를 통한 tsconfig.json 컴파일 파일 생성

tsc --init

3. tsc <파일명>.ts 명령어를 입력하여 컴파일된 js 파일을 만들어낸다.

기본타입

타입스크립트의 기본 타입은 아래와 같다.

const isDone: boolean = true | flase;
const decimal: number = Number;
const string: string = String;
const listA: type[] = [type, type, ..., type];
const listB: Array<type> = [type, type, ..., type];
const tuple: [string, number] = [String, Number];
// 자바처럼 열거형 사용 가능!
enum Addr {ABC, DEF}; // { '0': 'ABC', '1': 'DEF', ABC: 0, DEF: 1 }
// 모든 타입을 허용
const Any: any;
// 자바의 void처럼 함수에서 반환 값이 없을 때, 사용
function Void(): void { connsole.log('void') }
const Undefined: undefined = undefined;
const Null: null = null;
// 발생할 수 없는 타입을 의미한다. never를 반환하는 함수는 함수의 마지막에 도달할 수 없음.
function Never(): never { while (true) {} }
const Object: object;

interface

TS handybook - interface

• 인터페이스는 객체의 타입을 정해줍니다.

interface Person {
    firstName: string;
    lastName: string;
}

function greeter(person: Person) {
    return "Hello, " + person.firstName + " " + person.lastName;
}

let user = { firstName: "Jane", lastName: "User" };

const result = greeter(user); 

객체의 키값에 따른 타입을 정해줍니다.