TS | Import 와 Export

| TypeScript에서의 Import와 Export

TypeScript는 모듈화를 지원하여 코드의 재사용성과 유지보수성을 향상시킬 수 있습니다. 

이를 위해 import와 export 키워드를 사용하여 모듈을 가져오고 내보내는 방법을 제공합니다. 

Export 

export 키워드를 사용하여 변수, 함수, 클래스 등을 다른 파일에서 사용할 수 있도록 내보낼 수 있습니다. 

예를 들어, 다음은 CatType과 Cat을 내보내는 예입니다.

export type CatType = {
  id: string;
  name: string;
  age: number;
  species: string;
  isCute: boolean;
  friends: string[];
};

export const Cat: CatType[] = [
  // Cat 객체들의 배열
];

위의 코드에서 export 키워드를 사용하여 CatType과 Cat을 외부로 내보내고 있습니다.

이렇게 내보낸 모듈은 다른 파일에서 import하여 사용할 수 있습니다.

 

Import

import 키워드를 사용하여 다른 파일에서 내보내진 모듈을 가져올 수 있습니다.

아래는 CatType과 Cat을 가져오는 예시입니다.

import { CatType, Cat } from './cat';

// 가져온 모듈 사용
console.log(CatType);
console.log(Cat);

위의 코드에서 import 문을 사용하여 CatType과 Cat을 ./cat 경로에서 가져오고 있습니다.

 

이후 해당 모듈을 사용하여 원하는 작업을 수행할 수 있습니다.

Default Export 또한, 모듈에서 기본적으로 내보내는 항목을 default 키워드를 사용하여 지정할 수 있습니다.

default 키워드를 사용하는 경우 import 문에서 이름을 지정하지 않고 모듈을 가져올 수 있습니다.

예를 들어, 다음은 default 키워드를 사용하여 CatType을 내보내는 예입니다.

export default interface CatType {
  id: string;
  name: string;
  age: number;
  species: string;
  isCute: boolean;
  friends: string[];
}

위의 코드에서 CatType 앞에 default 키워드를 사용하여 해당 인터페이스를 기본 내보내기로 설정하였습니다.

이후 다른 파일에서는 다음과 같이 가져올 수 있습니다.

import CatType from './cat';

// 가져온 모듈 사용
console.log(CatType);

 

정리

TypeScript에서 import와 export 키워드를 사용하여 모듈을 가져오고 내보낼 수 있습니다.

export를 통해 모듈에서 내보낼 항목을 지정하고, import를 통해 다른 파일에서 해당 모듈을 가져와 사용할 수 있습니다.

이를 통해 코드의 재사용성과 모듈화를 향상시킬 수 있습니다.