책상/JavaScript
[JS] module.exports와 export default의 차이점
dev_neo
2019. 5. 29. 00:00
import, export는 es6에서 공식적으로 채택된 모듈화 방식이다.
default는 기본값으로 내보낼 함수, 객체 등이며, 받아올 때(import) 사용자가 원하는 대로 이름을 지정할 수 있다.
// export.js
const a = 1;
const b = 2;
export { a };
export const c = 3;
export default b;
----------------------
// import.js
import d, { a, c as e } from 'export';
console.log(d, a, e); // 2, 1, 3
Node.js와 이전의 브라우저에서는 commonJS 기반의 require 키워드를 이용해 모듈화를 시킨다.
module 객체에 담아서 내보낸다고 생각하면 이해가 편하다.
// export.js
const a = 'a';
const b = 'b';
module.exports = { a, b }
----------------------
// import.js
const alphabet = require('export');
console.log(alphabet); // { a: 'a', b: 'b' }
* 참고
(ECMAScript) ES2015(ES6) 모듈 시스템 - import, export, default
안녕하세요. 이번 시간에는 모듈 시스템에 대해 알아보겠습니다. ES2015에서 바뀐 것들 중에서 가장 획기적이라고 생각하는 변화입니다. 자바스크립트는 예전부터 리소스 관리가 어려워서 말이 많았습니다. 리소스는 웹 페이지를 구성하는 자원들입니다. 현재 웹에서는
www.zerocho.com
https://d2.naver.com/helloworld/12864