반응형
1. require()과 module.exports, exports
require + module.exports/exports
- require()함수는 module.exports를 리턴한다.
// foo.js
const a = 10;
exports.a = a;
//bar.js
const foo = require('./foo.js');
console.log(foo.a);
exports와 module.exports의 차이
exports는 단순히 짧은 alias일 뿐, module.exports를 참조할 뿐이다.
❗ 하지만 동일하다고 생각하면 안된다! 아래를 잘 읽어보자.
2. module.exports와 exports
동일한 코드
정석 코드
module.exports.foo = "bar"
더 짧게 쓰기 (module.exports ➡ exports)
exports.foo = "bar"
"bar"라는 property 대신 다른 임의의 함수가 들어가도 된다.
(module.exports)
module.exports.foo = function() {
console.log("foo");
}
(exports)
exports.foo = function() {
console.log("foo");
}
잘못된 코드
1. exported property/function 들의 컨테이너로 쓸 경우
❌ exports = { foo : "bar"}
❌ exports = function() { console.log("foo") }
다음 코드들은 기존의 module.exports에 key, value를 넣는 것이 아니라, module.exports와는 다른 exports라는 변수에 새로운 값을 넣은 것이다. 결국, 값을 저장해야 할 module.exports는 비어있게 되는 형식이므로 이렇게 작성하면 안된다!
정 exports를 새로 정의하고 싶다면 아래와 같이 작성해야 한다.
👍 module.exports = exports = function() { console.log("foo") }
2. constructor function으로 쓰는 경우
정색대로 쓰려면 아래처럼 써야 한다.
👍 module.exports = function() { console.log("foo") }
하지만, 아래는 작성할 순 있지만 이렇게 작성하는 것은 비추이다.
❗ module.exports.one = 1
왜냐하면 constructor function으로 쓰는 경우, constructor 하나만 들어가는 것이 훨씬 가독성이 높기 때문이다.
프로퍼티/함수를 동일한 계층으로 보고 한꺼번에 묶어서 exports하는 것은 납득이 가지만, 오브젝트와 프로퍼티 혹은 오브젝트와 함수를 동일한 계층으로 보는 것은 문제가 있다고 보기 때문이다.
3. 정리
- require()은 module.exports를 리턴한다.
- exports는 module.exports를 refer하며, shortcut에 불과하다.
- exports와 module.exports의 용례를 잘 익혀야 한다.
참고 자료
반응형
'Front-End: Web > JavaScript' 카테고리의 다른 글
[JS] undefined와 null의 차이점은? (0) | 2021.10.15 |
---|---|
[작성중]자바스크립트 Array의 모든 메서드를 알아보자! (0) | 2021.09.30 |
js class (0) | 2021.07.03 |
for in & for of (0) | 2021.06.11 |
정규표현식 (0) | 2021.05.28 |