[typescript] 내보내기와 가져오기를 사용하여 모듈을 구성하는 방법

TypeScript에서 모듈을 내보내고 가져오는 것은 코드를 재사용하고 유지보수하기 쉽게 만드는 중요한 기술입니다. 모듈 사용을 통해 코드를 더욱 모듈화하고 재사용 가능한 단위로 분리할 수 있습니다. 이번 글에서는 TypeScript에서 모듈을 정의하고 사용하는 방법에 대해 알아보겠습니다.

1. 모듈 내보내기 (Export)

TypeScript에서 모듈을 내보내는 방법은 export 키워드를 사용하는 것입니다. 다음은 greet.ts 파일에서 sayHello 함수를 내보내는 예제입니다.

// greet.ts

export function sayHello(name: string): string {
  return `Hello, ${name}!`;
}

위의 예제에서 sayHello 함수를 export 키워드를 사용하여 외부에서 사용할 수 있도록 내보냈습니다.

2. 모듈 가져오기 (Import)

내보낸 모듈을 다른 파일에서 가져오려면 import 키워드를 사용합니다. 아래의 예제는 greet.ts 모듈을 가져와 사용하는 방법을 보여줍니다.

// main.ts

import { sayHello } from "./greet";

console.log(sayHello("John"));

위의 예제에서 import 키워드를 사용하여 greet.ts 파일에서 sayHello 함수를 가져와 호출하고 있습니다.

3. 기본 내보내기 (Default Export)

모듈에서 하나의 기본 객체나 함수만 내보내려면 export default 문장을 사용합니다. 다음은 greet.ts 파일에서 sayHello 함수를 기본으로 내보내는 예제입니다.

// greet.ts

export default function sayHello(name: string): string {
  return `Hello, ${name}!`;
}

기본으로 내보낸 모듈은 다음과 같이 가져올 수 있습니다.

// main.ts

import sayHello from "./greet";

console.log(sayHello("Elaine"));

4. 모듈 가져오기 경로

모듈을 가져올 때 상대 경로나 절대 경로를 사용할 수 있습니다. 예를 들어, 같은 디렉토리에 있는 모듈을 가져올 때는 상대 경로를 사용할 수 있습니다.

// main.ts

import { sayHello } from "./greet";

만약 상위 디렉토리에 있는 모듈을 가져오려면 상대 경로 대신 절대 경로를 사용할 수 있습니다.

// main.ts

import { sayHello } from "../greetings/greet";

이것으로 TypeScript에서 모듈을 내보내고 가져오는 기본적인 방법에 대해 알아보았습니다. 모듈을 사용하여 코드를 모듈화하고 재사용 가능한 단위로 분리함으로써 프로젝트의 유지보수성을 높일 수 있습니다.