모듈(Module)이란?
-
import,export가 있는 파일은 모듈(Module)로 취급이 된다. -
외부에서 직접적으로 모듈을 불러오지 않는 이상 그 모듈의 데이터를 사용 할 수 없다 .
Ambient module
ts 파일끼리는 이상한 점이 있는데..
바로 import export 없이도 타입들을 다른 파일에서 가져다 쓸 수 있다는 점이다.
run타임이기 전에는 타입,변수 import export 없이도 사용가능하지만, runtime 때는 변수들쓰면 없다라고 뜬다!!!
// sample.ts
type A = number
let a : A = 1
// index.ts
let b : A = 2 // type을 import export 없이도 사용가능
console.log(b+a) // 가능
// index.js
let b = 2
console.log(b+a) // 가능하긴한데... 결국 브라우저에서는 못 찾음
// 브라우저에 콘솔창에서
// a is not defined다시 한번더 말하지만 ts 끼리만 변수, 타입등을 import, export 업이 사용 가능하지만
js로 컴파일 후 run타임때는 변수 같은 경우 오류난다. import export 해줘야함
암튼
import export 없어도 같은 폴더에 있는 ts 파일은 그냥 사용이 가능한테 이유는 global 변수 취급을 받기 때문이다.
즉, 전역으로 쓸 수 있다라는 말인데...
전역으로 쓸 수 있는 '파일'을 전문용어로 ambient module 이라고 말한다.
'변수' 가 아니라 파일을 전문용어로 ambient module 이라고 말한다.
그렇다면 전부 import export 없이 써서 편리하긴 한데...
팀 협업시 어떻하냐... 충돌나고 그럴텐데... 🙄
반면에 import 혹은 export 키워드가 하나라도 들어간 ts 파일은 다르다.
import / export 키워드가 적어도 하나 있으면 그 파일은 local module이 되고 거기있는 모든 변수는 export를 해줘야 다른 파일에서 사용이 가능하다. 😋
// sample.ts
export type A = number;
let a: A = 1;
// index.ts
let b: A = 1; // 불가능
console.log(b + a); // 불가능
위와 같이 export가 하나라도 있으면 import 문법 써야함
근데 저렇게 하기 귀찮다면... export {} 하면 된다.
// sample.ts
type A = number;
let a: A = 1;
// 빈 객체 export, 어쨋건간에 export 하나라도 있으면 import 해줘야 하니까
export {}
// index.ts
let b: A = 1; // 불가능
console.log(b + a); // 불가능이러면 sample.ts에 있던 파일은 더 이상 글로벌 모듈(ambient module)이 되지 않으며 다른 파일에서 함부로 가져다 쓸 수 없다.
그런데 저렇게 위와 같이 로컬 모듈로 되어진 sample.ts에서 글로벌 모듈로 쓰고 싶을 때가 있지 않을까??
declare global
//sample.ts
type Local = number;
const localA= 1;
declare global {
type GlobalNumber = number;
const globalB = 1;
}
export {};
// index.ts
const c:Local = 1 // 불가능
console.log(localA+1) // 불가능
const d : GlobalNumber =1 // 가능
console.log(d+globalB) // ts에서는 가능local module이 된 곳에서만 사용 할 수 있는!!!!
declare global 이라는 문법은
선언 해놓고 객체 형태로 그 안에다 변수, 타입들을 명시 한 후
다른 파일에서 그냥 가져다 쓰면 된다. global.변수 이런거 안해줘두 된다.
이러한 declare global도 일종의 namespace 문법인데 global이라는 이름의 namespace객체 안에 타입, 변수, 함수들을 추가 하는 거라고 보면 될것 같다.
