[JavaScript] Module 사용 방식 : CJS, ESM

Module

자바스크립트의 크기가 커지고 복잡해지는 것을 방지하기 위해 파일을 분리한 것.

보통 클래스 파일 하나 또는 여러 함수와 객체로 구성된 파일 하나를 의미한다.

-> '분리하기 위해 사용하는 단위' 정도로 이해했다.

 

사용방법

CJS(CommonJS) 방식

module.exports를 이용해 내보내기를 한다.

 

불러올 때는 require() 함수를 이용한다. 모듈의 경로를 () 안에 입력한다.

 

모듈을 불러온 파일을 실행해주면 위와 같이 정상 작동한다.

 

 

ESM(ECMAScript Modules) 방식

export{} 를 이용해 한번에 내보낼 수 있다.

이렇게 하나씩 따로 보낼 수도 있다.

 

불러올 때는 import {} from ""; 문으로 불러올 값과 경로를 입력해주면 된다.

 

다만 확장자명을 js가 아닌 mjs로 해줘야 한다. 불러올 모듈과 사용할 파일 모두 mjs로 바꿔준다.

 

이후 실행해주면 깔끔하게 필요한 값만 나온다.