[TypeScript] TypeScript란?

1. TypeScript란?

Microsoft에서 개발한 오픈소스 프로그래밍 언어로, JavaScript의 슈퍼셋(Superset)이다.

 

* 슈퍼셋(Superset)

-> 특정 언어 또는 기술이 다른 언어의 모든 기능을 포함하며 추가적인 기능을 제공하는 것이다.

 

즉, TypeScript는 JavaScript의 기능을 모두 포함하며 정적 타입(static type) 기능을 추가해 더욱 안전하고 유지보수하기 쉬운 코드를 작성하도록 도와준다.

 

1-1. 특징

1) 정적 타입 지원

TypeScript에서는 정적 타입을 지원해 컴파일 시점에서 타입 오류를 발견할 수 있다.

이를 통해 JavaScript에서 느낄 수 없는 코드의 안정성을 증가시키고, 런타임 오류를 줄일 수 있다.

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

console.log(add(2,3));
console.log(add("2", 3)); // 컴파일 오류 발생

 

2) 코드 가독성과 유지보수성 향상

인터페이스와 타입 별칭을 활용해 코드의 구조를 쉽게 이해하고 유지보수 할 수 있다.

interface User {
    id: number;
    name: string;
}

// or

type User = {
    id : number;
    name : string;
};

function getUserInfo(user : User): string {
    return '아이디: ${user.id}, 이름 : ${user.name};
}

 

3) 객체 지향 프로그래밍 지원

TypeScript는 ES6에서 새롭게 사용된 문법을 포함하고 있어 클래스, 인터페이스, 상속 등과 같은 객체 지향 프로그래밍 패턴을 제공한다.

 

1-2. TypeScript 와 JavaScript 비교

둘에 대한 비교를 표로 정리하자면 다음과 같다.

언어	TypeScript	JavaScript
언어 타입	정적 타입(Static Typing) 지원	동적 타입(Dynamic Typing)
컴파일 필요 여부	tsc(TypeScript Compiler)로 JavaScript로 변환 후 실행	별도의 컴파일 없이 브라우저나 Node.js에서 바로 실행 가능
타입 검사	컴파일 시점에서 타입 오류 감지	런타임에서만 타입 오류 발생 가능
인터페이스(Interface) 지원	지원	지원하지 않음
제네릭(Generics) 지원	지원	지원하지 않음
OOP(객체지향 프로그래밍) 지원	클래스, 인터페이스, 접근 제어자 등 OOP 기능이 강화됨	ES6 이후 클래스 지원하지만 TypeScript만큼 강력하지 않음
모듈 시스템	ES6 모듈 + 네임스페이스 지원	ES6 모듈 지원
코드 가독성 및 유지보수성	타입 정보 덕분에 코드의 안정성이 높고 유지보수하기 쉬움	타입이 없어 대규모 프로젝트에서는 유지보수가 어려울 수 있음
유틸리티 타입 지원	Partial<T>, Readonly<T>, Pick<T>, Omit<T> 등 제공	없음
런타임 오류 가능성	컴파일 단계에서 오류를 미리 잡아줄 수 있음	실행 중에 오류 발생 가능성 높음
코드 실행 속도	JavaScript로 변환 후 실행되므로 추가적인 컴파일 과정 필요	즉시 실행 가능 (빠른 실행)

 

 

이제 TypeScript에 대해 계속해서 정리해보겠다.