export - 모듈 정의 후 export할 값들을 내보낸다.
// module.js
function foo(x) {
return x * x * x;
}
const bar = (num) => Math.floor(num);
var graph = {
options: {
color:'white',
thickness:'2px'
},
draw: function() {
console.log('From graph draw function');
}
}
export { foo, bar, graph };
이것처럼 한 파일에서 여러 값을 내보낼 때 유용하다.
import - export한 값의 이름과 동일한 이름을 import 해야한다.
만약 import하는 파일 내에서 다른 변수명으로 사용하고 싶다면
import { foo, bar, graph as newGraph } from './module';
newGraph.options.color; // "white";
으로 이름을 재정의 해준다.
export - 하나의 파일에서 단 하나의 객체만 export 할 수 있다.
// module.js
export default function (x) {
return x * x;
}
import - export한 값의 이름이 아니더라도 쓰고 싶은 이름으로 import 가능하다.
또, default 키워드와 함께 export한 모듈은 {} 없이 임의의 이름으로 import한다.
파일 하나에 하나의 객체만 export 하기 때문인가보다.
import square from './module';
let result = square(10);
result; // 100
함께 작업하는 사람이 있다면 팀 규칙에 맞게 사용하면 좋을 것 같다.
유지보수를 위해서는 Named Export가 더 효율적이라는 의견도 있다고 한다.
파일 하나에서 하나만 export 하는 모듈 => default export
파일 하나에서 여러 값을 export 하는 모듈 => named export