Front-end/Typesrcipt
Typescript - import & export & namespace
Cuvely
2023. 4. 18. 16:55
728x90
반응형
Typescript exrpot
typescript export 란 파일에 선언되어있는 변수 및 함수 등을 다른 파일로 내보내서 사용한다는 것이다.
// test.ts
// export 키워드를써서 다른 파일에서 사용할 수 있도록 한다.
export var myName: string = 'zelord';
export var myAge: number = 27;
export 키워드를 써서 다른 파일에 사용할 수 있도록 선언한다.
export 키워드는 변수 뿐만 아니라 type 도 내보낼 수 있다.
// test.ts
export type MyName = string; // export 키워드를 사용하여 type 도 내보낼 수 있다.
Typescript import
Typescript import란 다른 파일에서 export 키워드를 사용한 변수 및 함수를 받아와서 사용할 수있다.
// index.ts
// import { 변수명 } from '파일경로'
import { myName, myAge } from './test' // import 키워드를 써서 불러온다.
console.log(myName); // test.ts 에 불러온 변수를 사용할 수 있다.
console.log(myAge);
import 키워드를 사용해서 test.ts에 export 키워드로 사용된 변수명을 가져와 {}사이에 넣고 from 뒤에 경로를 붙여 불러와서 사용할 수 있다.
반응형
Typescript namespace
Typescript namespace 란 논리적으로 연관된 코드를 묶는 방법이다. 여러파일에 걸쳐 하나의 namespace로 공유한다.
namespace myNamespace { // namespace 를 사용하여 타입을 선언할 수 있다.
export type MyName = string | number;
}
let word: myNamespace.MyName // namespace 를 활용하여 꺼내 사용할 수 있다.
namespace myNamespace2 {
export type MyName = string | number; // 중복된 type명을 써도 사용이 가능하다.
}
728x90
반응형