TypeScript 기초

TypeScript는 JavaScript에 정적 타입을 추가한 프로그래밍 언어입니다. 대규모 애플리케이션 개발에 특히 유용하며, JavaScript로 컴파일됩니다.

목차

개요

JavaScript는 동적 타입 언어여서 런타임에 오류가 발생하는 경우가 많습니다. TypeScript는 이러한 문제를 해결하기 위해 컴파일 시점에 타입을 검사하여 잠재적인 오류를 미리 방지해 줍니다. 따라서 코드의 안정성과 가독성이 향상되며, 협업이 용이해집니다.

참고

TypeScript는 모든 JavaScript 코드를 포함하는 상위 집합(Superset)이므로, 기존의 JavaScript 코드도 유효한 TypeScript 코드입니다.

기본 타입

TypeScript는 JavaScript의 원시 타입 외에 다양한 타입을 제공합니다.

타입 설명 예시
number 숫자 (정수 및 실수) let age: number = 30;
string 문자열 let name: string = "TypeScript";
boolean 논리값 (true/false) let isDone: boolean = false;
array 배열 let list: number[] = [1, 2, 3];
tuple 요소의 타입과 개수가 고정된 배열 let x: [string, number];
enum 열거형, 이름이 있는 상수들의 집합 enum Color {Red, Green};

인터페이스

인터페이스(Interface)는 객체의 구조를 정의하는 중요한 기능입니다. 객체가 특정 속성들을 가지고 있음을 보장하여 코드의 일관성을 유지하고, 오류를 방지합니다.

TypeScript 
interface User {
    name: string;
    age: number;
}

function printUser(user: User) {
    console.log(이름: ${user.name}, 나이: ${user.age});
}

// 올바른 사용 예
const user1 = { name: '김철수', age: 30 };
printUser(user1);

// 잘못된 사용 예 (컴파일 시 에러 발생)
const user2 = { name: '김영희' };
// printUser(user2); // Error: Property 'age' is missing

사용 예제

변수에 타입을 명시하고 함수에서 타입을 활용하는 간단한 예제입니다.

TypeScript 
let message: string = "Hello, TypeScript";

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

console.log(add(5, 3)); // 출력: 8
// console.log(add(5, "3")); // Error: Argument of type '"3"' is not assignable to parameter of type 'number'.

주의사항 및 팁

  • TypeScript 코드를 실행하려면 tsc(TypeScript Compiler)를 사용하여 JavaScript 코드로 변환해야 합니다.
  • tsconfig.json 파일을 통해 컴파일러의 다양한 설정을 할 수 있습니다.
  • Visual Studio Code와 같은 에디터는 TypeScript를 기본적으로 지원하여 실시간으로 타입 오류를 확인하고 자동 완성을 제공합니다.
주의

타입스크립트는 모든 오류를 잡아주는 만능 도구는 아닙니다. 런타임 오류의 일부를 예방할 뿐이며, 개발자가 직접 로직 오류를 해결해야 합니다.