📌 TypeScript = JavaScript + 정적 타입 시스템
코드의 안전성을 높이기 위해서는 정적 타입 시스템이 있는 언어를 사용하는 것이 중요합니다.
JavaScript
자바스크립트는 동적 타입 언어입니다.
동적 타입 언어는 프로그램을 실행한 후에 변수나 함수의 타입이 결정됩니다. 따라서 타입이 고정되지 않아 같은 변수에 여러 타입의 값을 자유롭게 할당할 수 있습니다
var 변수 = "string"
변수 = 1; // ✅ 가능타입시스템
타입 시스템이란 언어가 다룰 수 있는 타입(예: null, undefined, boolean, string, number)을 이해하고 처리하는 방식을 말합니다.
정적 타입 시스템
정적 타입 시스템은 프로그램을 실행하기 전에 모든 변수와 표현식의 타입을 확인합니다. 즉, 개발하는 동안 타입 오류를 찾아낼 수 있기 때문에, 프로젝트가 커지거나 유지보수가 필요할 때 매우 유용합니다.
◼ 동작 순서
- 타입스크립트 컴파일러가 코드를 분석합니다. 이 과정에서 문법이나 타입 오류를 체크합니다. 이를 “컴파일 타임에 분석한다”고 표현합니다.
- 오류가 없다면 모든 코드를 자바스크립트로 변환합니다. 즉, 런타임(프로그램 실행 시점)에는 타입스크립트 코드가 자바스크립트로 변환되어 동일하게 동작합니다.
이 때문에, 타입스크립트는 자바스크립트의 상위집합 언어라고 할 수 있습니다.
◼ 선언하는 방법
Interface(인터페이스)와 Type alias(타입 별칭)
타입을 선언하는 방법은 크게 두 가지가 있습니다.
// 인터페이스
interface ExampleInterface {
example: string;
}
// 타입 별칭
type ExampleType = {};
type StringType = string;
type UnionType = string | number;확장성(Extensibility)
interface Hello {
name: string
}
interface Hello {
age: number
} // ✅ 가능, Hello 는 name 과 age 모두를 포함하게 됨
type Hello2 = {
name: string
}
type Hello2 = {
age: number
} // ❌ 불가능인터페이스(interface)는 확장이 가능합니다. 다른 인터페이스를 상속하거나 동일한 이름으로 새로운 속성을 추가할 수 있습니다.
타입 별칭(type alias)은 한 번 정의되면 새로운 속성을 추가할 수 없습니다. 따라서 동일한 타입에 새로운 속성을 추가해야 하는 경우 인터페이스가 더 유리합니다.
복잡한 타입 표현(Complex Type Expressions)
인터페이스(interface)는 객체 타입을 정의할 때 주로 사용됩니다.
타입 별칭(type alias)은 객체 형태 뿐만 아니라, 유니온 타입, 튜플, 매핑된 타입 등 더 복잡한 타입을 표현할때 유리합니다. type A = B | C처럼 더 다양한 타입을 정의할 수 있습니다.
정리
인터페이스는 객체의 형태를 정의하고 확장해야 할 때 사용하고, 타입 별칭은 복잡한 타입 표현이 필요할 때 사용하면 좋습니다.
구조적 타입 시스템
타입스크립트는 구조적 타입 시스템을 사용합니다. 구조적 타입 시스템에서는 타입이 어떻게 선언되었는지가 아니라, 실제로 어떤 구조를 가지고 있는지에 따라 타입이 결정됩니다.
"만약 어떤 새가 오리처럼 걷고, 오리처럼 소리 내고, 오리처럼 행동한다면, 나는 그 새를 오리라고 부를 것이다."
이 개념을 Duck Typing이라고도 부릅니다. 두 객체의 구조가 같다면, 그들은 같은 타입으로 간주됩니다.
interface Person {
name: string;
age: number;
}
let p1: Person = { name: "Alice", age: 25 };
let p2 = { name: "Bob", age: 30 };
p1 = p2; // ✅ 성공: p2는 Person과 동일한 구조를 가짐