Node.js 입문 및 소개 - Node.js 모듈 시스템 활용하기

Node.js 입문 및 소개 - Node.js 모듈 시스템 활용하기

 

Module 이란?

- 전체 프로그램에 일부이지만 독립적인 파일로 분리되어 있어 언제든 다른 프로그램에 재사용 할 수 있는 단위를 모듈이라고 정의한다.

 

-> user.js || cart.js || payment.js 각각 하나의 js 파일이면서 module이라고 칭한다.

 

Module System 이란?

- 모듈을 만들고, 불러와 사용할 수 있도록 도와주는 시스템

 

-> Module System에는 Common JS 모듈(CJM) 시스템과 ES 모듈(ESM) 시스템이 있다.

 

Common JS 모듈(CJM)

- 내보내기 : module 내장 객체를 이용하면 되는데 module에는 exports라는 프로퍼티가 있어 원하는 값을 객체로 묶어 내보낼 수 있다.

- 불러오기 : require 내장 함수를 이용하면 되는데 인수로 전달받은 경로에서 내보내진 객체를 불러올 수 있다.

index.js 파일 (불러오기)

// Common JS 모듈 시스템으로 불러오기1
const moduleData = require("./math")

// 더하기 함수 출력
console.log(moduleData.add(1, 2));

// 뺴기 함수 출력
console.log(moduleData.sub(1, 2));

// ---- 1000lines ----

// Common JS 모듈 시스템으로 불러오기2
const { add, sub } = require("./math")

// 더하기 함수 출력
console.log(add(1, 2));

// 뺴기 함수 출력
console.log(sub(1, 2));

 

math.js 파일 (내보내기) 

// 더하기 함수
function add(a, b) {
	return a + b;
}

// 뺴기 함수
function sub(a, b) {
	return a - b;
}

// Common JS 모듈 시스템으로 내보내기
module.exports = {
    add,
    sub,
}

 

ES 모듈(ESM)

- ES 모듈 시스템을 사용하기 위해서는 package.json 파일에서 "type": "module"을 설정해 줘야 한다. 이 말은 즉 모듈 시스템을 ES 모듈 방식으로 하겠다는 의미와 동일하다.

index.js 파일 (불러오기)

// ES 모듈 시스템으로 불러오기
import { add, sub } from "./math.js"

// 더하기 함수 출력
console.log(add(1, 2));

// 뺴기 함수 출력
console.log(sub(1, 2));

 

math.js 파일 (내보내기) 

// 더하기 함수
function add(a, b) {
	return a + b;
}

// 뺴기 함수
function sub(a, b) {
	return a - b;
}

// ES 모듈 시스템으로 내보내기1
export { add, sub };

// ---- 1000lines ----

// 더하기 함수 (ES 모듈 시스템으로 내보내기2)
export function add(a, b) {
	return a + b;
}

// 뺴기 함수 (ES 모듈 시스템으로 내보내기2)
export function sub(a, b) {
	return a - b;
}

 

 

-> ES 모듈을 이용할 때 마지막으로 하나를 알고 간다면 기본값 default를 설정해 줄 수 있다는 것이다. default 값은 모듈당 1개만 내보낼 수 있으며, {} 객체로 담아 받아오지 않는다.

 

index.js 파일 (불러오기)

// ES 모듈 시스템으로 불러오기
import { add, sub } from "./math.js"
import multiply from "./math.js" // -> default값은 {} 객체로 담아 표기하지 않는다. 

// 불러오는 경로가 같다면 한 줄로 표기할 수도 있다.
import multiply, { add, sub } from "./math.js"

// 더하기 함수 출력
console.log(add(1, 2));

// 뺴기 함수 출력
console.log(sub(1, 2));

// 곱하기 함수 출력
console.log(multiply(1, 2));

 

math.js 파일 (내보내기) 

// 더하기 함수
export function add(a, b) {
	return a + b;
}

// 뺴기 함수
export function sub(a, b) {
	return a - b;
}

// 곱하기 함수 -> default값 고정값 내보내기
export default function multiply(a, b) {
	return a * b
}

 

강의 링크

https://www.udemy.com/course/react-next-master/