모듈(Module) 기초

1. 모듈이란?

모듈은 코드를 재사용 가능하게 만들고, 각 파일이 독립적으로 동작할 수 있도록 합니다. 모듈에는 사용자 만든 모듈, 시스템 모듈, 빌드인 모듈 등이 있습니다.

2. 모듈의 형태

모듈은 각 파일이 독립적인 스코프를 갖도록 하기 위해 즉시 실행 함수로 감싸져 있습니다.

(function(exports, require, module, __filename, __dirname){
    // 코드 내용
})()

파일이 로드될 때 즉시 실행되며, exports, require, module, __filename, __dirname 등의 변수를 사용할 수 있게 해줍니다.

3. 모듈의 기본 형태

(1) 단일 함수 모듈

const add = (a, b) => {
    return a + b;
}

module.exports = add;

add 함수를 정의하고 module.exports를 통해 외부에 노출합니다. module.exports = add;는 add 함수를 모듈의 출력으로 설정합니다.

(2) 직접 함수 모듈

module.exports = (a, b) => {
    return a + b;
};

함수 자체를 module.exports에 할당하여 모듈로 내보내고 있습니다.

(3) 여러 함수 모듈

const add = (a, b) => {
    return a + b;
}

const subtract = (a, b) => {
    return a - b;
}
module.exports = {
    // 이름이 같을 땐 하나만 적어도 된다.
    add, // => add : add,
    subtract // => subtract: subtract
}

여러 함수를 모듈로 내보내고 싶다면, 객체 형태로 module.exports에 할당합니다. 이렇게 하면 여러 함수를 하나의 모듈로 묶어서 내보낼 수 있습니다.

4. 모듈 출력 방법 (CommonJS 모듈)

(1) 단일 함수 모듈 가져오기

const add = require('./m1');
console.log(add(1, 2));

require 함수는 모듈을 가져오는데 사용됩니다. ./m1 모듈을 가져와 add 함수로 사용합니다.

(2) 여러 함수 모듈 가져오기

const math = require('./m2');
console.log(math.add(1, 2));
console.log(math.subtract(10, 5));

여러 함수를 포함하는 모듈은 객체 형태로 가져와 각 함수를 사용할 수 있습니다.

(3) 객체 디스트럭처링(Object Destructuring)을 사용한 모듈 가져오기

디스트럭처링(Destrucuring) 이란?

배열의 값 또는 객체의 속성을 풀어서 별개의 변수로 쓸 수 있게 해주는 문법입니다. 객체 디스트럭처링, 함수 디스트럭처링, 배열 디스트럭처링 등이 있습니다.

const math = require('./m2');
const { add, subtract } = math; // ES6 문법, 각각 적용됨.
console.log(add(1, 2));
console.log(subtract(10, 5));

ES6의 객체 디스트럭처링(Object Destructuring) 문법을 사용하면, 모듈에서 필요한 함수만 골라서 가져올 수 있습니다.

5. ES6에서 모듈

ES6 모듈은 import와 export 키워드를 사용하며, 파일 확장자는 .mjs를 사용합니다. 프로젝트에서 ES6 모듈을 사용하려면 package.json에 "type": "module"을 추가해야 합니다.

(1) ES6 모듈 정의하기

const add = (a, b) => {
    return a + b;
}
export default add;

export default를 사용하여 기본으로 내보낼 대상을 지정합니다.

(2) ES6 모듈 가져오기

import add from './math.mjs';
console.log(add(5, 5));

import 키워드를 사용하여 모듈을 가져옵니다. 확장자 .mjs를 반드시 명시해야 합니다.