[Typescript] 타입스크립트 타입 모듈화

problem_hun·2023년 3월 24일
0

타입스크립트

목록 보기
16/16
post-thumbnail

모듈

자바스크립트의 ES6+의 Modules 개념과 유사하다. 모듈화란 쉽게 말해서 다른 파일에 있는 자바스크립트의 코드를 특정 파일에서 사용할 수 있는 것을 의미한다.

타입스크립트에서는 특정 인터페이스나 타입을 다른 여러 파일에서 사용해야 할 경우가 있는데, 그럴 때 export로 내보내고 import로 들여와서 사용을 할 수 있다.

//types.ts
export interface Todo {
  title: string;
  checked: boolean;
}

// app.ts
import { Todo } from './types'; 
//from의 경로부터 작성해 주는 것이 좋다. 경로가 맞으면 객체안에 자동완성이 될 수 있다.

var item: Todo = {
  title: '할 일1',
  checked: false,
};

기본 문법

export

다른 파일에서 가져다 쓸 변수나 함수의 앞에 export 라는 키워드를 붙인다. export된 파일은 import로 불러와 사용할 수 있습니다.

export 변수, 함수

또는 파일의 맨 하단에서

export { 변수, 함수 }

import

export된 변수나 함수를 { }에 선언한 뒤 해당 파일이 있는 경로를 적어준다.

import { 불러올 변수 또는 함수 이름 } from '파일 경로';    
profile
문제아

0개의 댓글