타입스크립트 (TypeScript)란?
Javascript + Type을 지정해 에러 방지
TypeScript는 Javascript에 타입을 부여한 언어로, Javascript의 슈퍼셋인 오픈소스 프로그래밍 언어이다. 마이크로소프트에서 개발, 유지하고 있으며 엄격한 문법을 지원한다. Javascript의 슈퍼셋이기 때문에 Javascript로 작성된 프로그램이 TypeScript 프로그램으로도 동작한다. TypeScript에서 자신이 원하는 타입을 정의하고 프로그래밍을 하면 Javascript로 컴파일되어 실행할 수 있다.
장점
1. 정적 타입 - 에러 사전 방지, 안정성, 협업 용이성
TypeScript는 동적인 Javascript 언어에 타입을 미리 부여함으로써 컴파일 시 에러를 잡을 수가 있다. 때문에 사전에 오류를 디버깅 할 수 있고, 나중에 디버깅하는 시간을 줄여줘 생산적인 측면에서 효과적이며 안정성에도 도움을 준다. 이에 더해 협업하는 사람이나 혹은 다른 사람이 코드를 읽을 때 타입을 짐작할 수 있게 한다.
2. 실행 속도
Javascript는 동적 타입의 언어이다. 이 말은 런타임(실행) 시에 타입을 결정해서 적용된다는 것인데, 이것은 '컴퓨터'에게 오류가 있는지 없는지 체크하라고 일을 맡겨버린 것과 같기 때문에 실행 속도가 당연히 오래 걸린다. 하지만 TypeScript는 '사람'이 코드 작성 시에 오류를 체크하고, 타입을 미리 결정하기 때문에 기계가 할 일을 덜어 실행 속도가 매우 빠르다는 장점이 있다.
단점
1. 초기 세팅
컴파일 옵션,모듈 사용 설정 Javascript에 비해 초기 세팅이 까다롭다.
2. 가독성
TypeScript는 Javascript보다 코드를 더 많이 작성해야 한다. 개발 기간이 늘어나며, 코드를 더 작성하기 때문에 가독성이 더 떨어지는 부작용도 있다.
타입스크립트 (TypeScript) 관련 용어
Enum(열거형)
TypeScript의 열거형(Enum)은 특정 값의 집합을 정의할 때 사용된다. JavaScript에서는 기본적으로 열거형을 지원하지 않지만, TypeScript에서는 문자형 열거형과 숫자형 열거형을 지원한다.
// 숫자 열거형
enum Color {
Red = 1,
Green = 2,
Blue = 4,
}
// 문자 열거형
enum Direction {
Up = "UP",
Down = "DOWN",
Left = "LEFT",
Right = "RIGHT",
}인터페이스 (Interface)
TypeScript에서 인터페이스(Interface)는 일반적으로 타입 체크를 위해 사용된다. 인터페이스는 변수, 함수, 클래스에 사용할 수 있으며, 인터페이스에 선언된 프로퍼티 또는 메서드의 구현을 강제하여 일관성을 유지하도록 한다. TypeScript의 예약어인 interface를 사용하여 TypeScript 인터페이스를 생성할 수 있다.
interface User {
name: string;
age: number;
}
// 정상적으로 선언됩니다.
const user: User = {
name: "anna",
age: 20
}인터페이스 내에는 name과 age가 정의되어 있기 때문에, User 인터페이스를 사용하여 변수를 선언할 때는 반드시 정의된 프로퍼티를 전부 작성해야 한다. 또한 interface로 정의된 속성만 지정할 수 있으며, 그 외 프로퍼티를 추가로 작성하고자 해도 인터페이스 내에 정의되어 있지 않기 때문에 추가로 프로퍼티를 더 작성하여 선언할 수 없다.
그러나 인터페이스 안의 모든 프로퍼티가 필요한 것은 아니며, 어떤 조건에서만 존재하거나 아예 없을 수도 있기 때문에 ? 연산자를 사용하여 선택적 프로퍼티를 작성할 수도 있다.
interface User {
name: string;
age?: number;
}
// 정상적으로 선언됩니다.
const user: User = {
name: "anna"
}타입 별칭 (Type Aliases)
타입 별칭(Type Aliases)은 기존의 타입을 참조하는 것을 의미한다. 타입 별칭을 이용하여 타입의 새로운 이름을 만들 때 키워드 type을 사용하여 작성한다.
type MyString = string;
// regular way
let str1: string = 'hello!';
// string 타입처럼 사용할 수 있습니다.
let str2: MyString = 'hello world!';타입 별칭을 사용하면 코드를 더 간결하고 가독성 좋게 만들 수 있다. 또한 복잡한 타입을 간략하게 표현하고, 타입 정의를 재사용하는 등 가독성을 높일 수 있다.
인터페이스 vs 타입 별칭
타입 별칭은 말 그대로 타입에 새로운 이름을 부여하는 것에서 그치기 때문에 확장이 되지 않는다. 그러나 인터페이스는 확장이 가능하다. 인터페이스는 기존의 인터페이스 및 타입 별칭으로 만들어진 타입 둘 다 상속할 수 있기 때문에, 유연한 코드 작성을 위해서는 인터페이스로 만들어서 필요할 때마다 확장할 수 있다.
타입 추론 (Type Inference)
TypeScript는 정적타입을 지원하는 프로그래밍 언어다. 정적타입 시스템을 사용하면 코드의 안정성을 높이고 디버깅을 용이하게 할 수 있다.
타입 추론(Type Inference)은 변수나 함수의 타입을 선언하지 않아도 TypeScript가 자동으로 유추하는 기능이다.
장점
- 코드의 가독성 향상: 명시적으로 타입을 지정하지 않아도 코드에서 변수의 타입을 알 수 있기 때문에 타입 추론을 사용하면 코드의 가독성이 향상
- 개발 생산성 향상: 명시적으로 타입을 지정하지 않아도 TypeScript가 자동으로 타입을 추론하기 때문에 타입 추론을 사용하면 코드 작성 시간을 단축 가능
- 오류 발견 용이성: 입 추론을 사용하면 코드의 . TypeScript는 변수나 함수의 타입을 추론하여 타입 검사를 수행하기 때문에 오류를 발견하는 것이 쉬워짐
단점
- 타입 추론이 잘못될 경우 코드 오류 발생: 타입 추론은 TypeScript가 자동으로 수행하는 것이기 때문에, 추론이 잘못될 경우 코드 오류가 발생 가능성이 있음
- 명시적인 타입 지정이 필요한 경우가 있음: 타입 추론만으로는 부족한 경우가 있음
제네릭 (Generic)
타입스크립트의 제네릭(Generic)은 코드 재사용성을 높이고 타입 안정성을 보장하는 기능이다. 제네릭을 사용하면 함수나 클래스를 작성할 때, 사용될 데이터의 타입을 미리 지정하지 않고, 이후에 함수나 클래스를 호출할 때 인자로 전달된 데이터의 타입에 따라 자동으로 타입을 추론하게 된다.
