front-end/javascript

[javascript] ES6 export vs NodeJS module.exports와 exports의 차이

MOOB 2019. 10. 25. 20:36

모듈

NodeJS에서의 모듈

모듈이란 관련된 코드를 하나의 코드 단위로 캡슐화 하는 것을 말한다. 여러개의 코드로 분할하여 관리하고 index.js 파일 하나에 전부 import 시켜 효율적으로 코드를 관리할 수 있다.

module.exports = {
    hello: function() {
        return "HELLO";
    },

    bye: function() {
        return "BYE";
    }
};

위와 같이 모듈을 작성하면 메안 파일에서 다음 코드를 통해 const greeting = require(‘./greeting’); 작성한 모듈을 import 시킬 수 있다.

여기에서 require 코드는 object를 반환한다. 또한 module.exportsexports는 동일 객체를 바라보고 있고 반환 값은 항상 module.exports이다. exportsmodule.exports를 참조하는 형태이며 exports 자체는 반환되지 않는다.

//값을 반환하지 않아서 다음과 같은 대체문이 필요함
exports = module.exports = {}

exports.add = (a, b) => a + b //축약
exports = {
  add(a, b) { return a + b }
} 

결론 : exports는 이름은 exports이나 실제로 반환하지 않는다. 헷갈리면 그냥 module.exports를 쓰자

ES6에서의 모듈

노마드 코더에서 강의할 때 export된 변수를 import from을 사용했는데 위 강의를 들을 때는 컴파일이 안되서 고민했었다. 그런데 내가 위 강의에서 들은 건 nodeJS에서의 모듈 시스템이고 노마드 코더에서 사용한 건 ES6의 모듈 시스템이었다. 결국 둘이 똑같음.

이걸 찾아본 포스팅에서는 Node에서는 아직 ES6의 모듈을 지원 안한다고 했는데 노드 새로 깔고 하니까 된다 최신 버전에선 되는 것 같음. 근데 헷갈리게 왜 exportexports라고 했는지 모르겠다.

둘이 다른 거라서 비교 포스팅도 없었다.

모듈을 사용하는 목적은 같은데 사용 방법이 조금 다르다. ES6에서는 export를 사용한다. 원시값(boolean, let, const 등등)이든 참조값(object , function 등)이든 전부 사용 가능하다.

export const a = 1;
export default b = 2;

default가 붙으면 import할 때 괄호 안 붙여도 된다. 그리고 as c처럼 해당 파일에서 변수 이름을 바꿀 수 있다! import * from './somewhere'라고 하면 export한 모든 값을 import한다.

import b, {a as c} from './somewhere';