타입스크립트의 첫걸음: 기본 타입과 인터페이스 마스터하기

TypeScript는 JavaScript에 정적 타입을 추가한 상위 집합(Superset) 언어입니다. 타입을 명시함으로써 개발자는 컴파일 시점에 오류를 발견하고, 코드의 가독성과 유지보수성을 크게 향상시킬 수 있습니다.

이 챕터에서는 타입스크립트의 가장 기본적인 구성 요소인 기본 타입과 인터페이스에 대해 알아봅니다.

1. 타입스크립트의 기본 타입

JavaScript가 제공하는 원시 타입을 포함하여 타입스크립트는 다음과 같은 기본 타입을 지원합니다.

• string: 문자열
• number: 숫자 (정수, 실수 모두 포함)
• boolean: true 또는 false
• null / undefined: 각각 null과 undefined 값
• any: 모든 타입을 허용하는 타입 (가급적 사용을 피하는 것이 좋습니다)
• object: 원시 타입을 제외한 나머지 타입 (배열, 객체 등)

let frameworkName: string = "React";
let version: number = 18.2;
let isLearning: boolean = true;

console.log(`${frameworkName} v${version} 학습 중인가요? ${isLearning}`);

배열과 튜플

배열을 타입으로 지정하는 방법은 두 가지가 있습니다.

// 방법 1: 타입[]
let skills: string[] = ["TypeScript", "React", "Node.js"];

// 방법 2: Array<타입>
let projectCounts: Array<number> = [10, 25, 3];

튜플(Tuple)은 길이가 고정되고 각 요소의 타입이 정해진 배열입니다.

// [string, number] 타입의 튜플
let userProfile: [string, number] = ["nova99", 28];

2. 인터페이스(Interface)의 이해와 활용

인터페이스는 객체의 구조를 정의하는 데 사용됩니다. 특정 형태를 따르도록 객체에 대한 규칙을 설정하는 것이죠. 이는 팀원 간의 협업 시 매우 강력한 도구가 됩니다.

interface User {
    username: string;
    email: string;
    age: number;
    isPro?: boolean; // `?`는 선택적 프로퍼티(Optional Property)를 의미합니다.
}

function printUser(user: User): void {
    console.log(`사용자: ${user.username}, 이메일: ${user.email}`);
    if (user.isPro) {
        console.log("프로 사용자입니다.");
    }
}

const newUser: User = {
    username: "pixelwave88",
    email: "[email protected]",
    age: 32,
    isPro: true
};

printUser(newUser);

인터페이스는 객체뿐만 아니라 함수나 클래스의 구조를 정의하는 데에도 사용될 수 있어 확장성이 매우 뛰어납니다. 이처럼 타입과 인터페이스를 잘 활용하는 것만으로도 여러분의 코드는 훨씬 더 안정적이고 예측 가능해질 것입니다.