Modules - 자바스크립트 모듈화 방법
- ES5에서는 모듈화 방법이 없어서 모듈화를 위해 모듈 로더 라이브러리(AMD, Common JS)를 사용했었다.
- 모듈이란? 특정 기능을 수행하는 한 단위다.
- 자바스크립트 모듈 로더 라이브러리 기능을 js 언어 자체에서 지원
- 호출되기 전까지는 코드 실행과 동작을 하지 않는 특징이 있음
// libs/math.js
export function sum(x,y) {
return x + y;
}
export var pi = 3.141593;
// main.js
import {sum} from 'libs/math.js';
sum(1, 2);
- ES5는 자바 스크립트는 파일을 나눠도 자바처럼 스코프가 달라지지 않았다.
- 범수의 유효범위 즉, 안전성의 측면에서 모듈을 지원
- 제일 많이 사용하는 것이 바로 export default
default 는 1개의 파일에서 하나만 export가 가능하다.
// util.js
export default function (x) {
return console.log(x);
}
// main.js
import util from 'util.js';
console.log(util); // function (x) { return console.log(x); }
util("hi");
// app.js
import log from 'util.js';
console.log(log);
log("hi");
- 똑같은 파일의 똑같은 함수를 import 할 때 이름을 다르게해서 필요에 따라 골라서 사용할 수 있다.
