[typescript] 네임스페이스를 사용하여 모듈을 구성하는 방법

12 Dec 2023

TypeScript에서 네임스페이스를 사용하여 모듈을 구성하는 방법을 살펴보겠습니다.

네임스페이스란?

네임스페이스는 관련된 인터페이스, 클래스, 함수 등을 묶어서 코드를 구조화하는 TypeScript의 기능입니다. 네임스페이스는 전역 범위 내에서 이름 충돌을 피하기 위한 방법으로 사용됩니다.

다음은 네임스페이스를 사용하여 모듈을 구성하는 간단한 예제입니다.

// MyNamespace.ts
namespace MyNamespace {
  export interface Person {
    name: string;
    age: number;
  }
}

// app.ts
/// <reference path="MyNamespace.ts" />

let person: MyNamespace.Person = {
  name: "John",
  age: 30
};

위 예제에서 MyNamespace.ts 파일은 Person 인터페이스를 MyNamespace 네임스페이스 내에 정의하고, app.ts 파일에서 이를 사용하고 있습니다.

네임스페이스를 사용하여 모듈을 구성하는 방법과 비교하여 외부 모듈을 사용하는 방법에 대해 알아보겠습니다.

// MyNamespace.ts
namespace MyNamespace {
  export interface Person {
    name: string;
    age: number;
  }
}

// app.ts
/// <reference path="MyNamespace.ts" />

let person: MyNamespace.Person = {
  name: "John",
  age: 30
};

// Person.ts
export interface Person {
  name: string;
  age: number;
}

// app.ts
import { Person } from './Person';

let person: Person = {
  name: "John",
  age: 30
};

네임스페이스를 사용한 모듈 구성과 외부 모듈을 사용한 모듈 구성은 각각의 장단점이 있으며, 프로젝트의 특성에 맞게 선택하여 사용해야 합니다.

네임스페이스를 통한 모듈 구성에 대한 내용을 살펴보았습니다. TypeScript 공식 문서나 관련 자료를 참고하여 더 자세한 내용을 학습하시기를 권장드립니다.

TypeScript Handbook: Namespaces (https://www.typescriptlang.org/docs/handbook/namespaces.html)