[CS/기술면접] 모듈 (Module)

모듈 (Module)이란 무엇인가요? Node.js에서 모듈을 사용하는 방법은 무엇인가요?

 

• [2023.04.21.금] 멘토링 (박세명 기술 멘토님)
  • nodejs에서 commonjs로 모듈 사용하는 경우가 많은 이유는?
    • 선배들이 그렇게 써왔어서
    • 사실 commonjs로 쓰냐 ES6 방식으로 쓰냐에 따른 성능 차이는 크지 않고, 오히려 전체 로직 구조 효율성에 따른 성능 차이가 더 중요함

 

1. 한마디 정리

모듈 (Module)은 프로그램의 일부를 나타내는 독립적인 코드 블록으로, 함수, 변수, 객체 등이 포함될 수 있습니다.
모듈화는 코드의 재사용성을 높이고 유지보수를 용이하게 합니다.

Node.js에서 exports 객체를 사용하여 모듈에서 외부로 공개할 함수나 변수를 지정하고
다른 파일에서 모듈을 사용하도록 하기 위해 require 함수를 사용해 모듈을 로드합니다.

exports 객체에 지정한 함수나 변수는 모듈을 로드한 파일에서 접근할 수 있습니다.
require 함수는 로드한 모듈을 반환합니다. 반환된 모듈은 변수에 저장하여 사용할 수 있습니다.

 

2. 내가 생각한 꼬리질문

1) 모듈 사용의 장점과 단점

모듈 사용의 장점과 단점은 다음과 같습니다.

1. 장점
1) 코드 재사용성
모듈은 기능을 독립적으로 분리하여 작성하므로, 같은 기능을 다른 부분에서 사용해야 할 때 모듈을 재사용하여 중복 코드를 줄일 수 있습니다.

2) 유지보수 용이성
모듈은 기능별로 분리되어 있기 때문에 유지보수할 때 해당 모듈만 수정하면 됩니다. 따라서 전체 코드를 수정할 필요 없이 수정된 모듈만 변경하여 유지보수를 쉽게 할 수 있습니다.

3) 가독성 향상
모듈을 사용하면 코드가 분리되어 있기 때문에 전체적인 코드 가독성이 향상됩니다.

4) 코드 병렬 작업 가능
모듈은 독립적으로 개발되므로 다른 모듈과 병렬적으로 작업할 수 있습니다.

2. 단점
1) 모듈 간 의존성 관리가 필요
모듈은 기능별로 분리되어 있기 때문에, 모듈 간의 의존성이 생길 수 있습니다. 이러한 의존성을 관리하지 않으면 모듈이 변경되면 다른 모듈도 영향을 받을 수 있습니다.

2) 모듈 수가 많아질 수록 성능 저하
모듈을 많이 사용하면 파일 I/O와 같은 작업으로 인해 성능이 저하될 수 있습니다.

3) 모듈간 인터페이스 정의 필요
모듈 간의 인터페이스 정의가 필요합니다. 인터페이스 정의가 누락되면 모듈 간 호환성 문제가 발생할 수 있습니다.

따라서, 모듈 사용은 코드의 재사용성과 유지보수성을 높일 수 있지만, 모듈 간의 의존성과 인터페이스 정의 등을 고려하여야 합니다.

장점	단점
코드 재사용성	모듈 간 의존성 관리 필요
유지보수 용이성	모듈 수가 많아질 수록 성능 저하
가독성 향상	모듈 간 인터페이스 정의 필요
코드 병렬 작업 가능

 

2) 모듈 간의 의존성이란?

모듈 간의 의존성은 한 모듈이 다른 모듈에서 제공하는 기능이나 변수 등을 사용해야 하는 경우를 의미합니다. 의존성이 발생하면 모듈 간의 상호작용이 필요하므로 인터페이스 정의와 의존성 관리가 중요해집니다.

 

3) 모듈의 인터페이스란?

모듈의 인터페이스란 모듈 외부에서 모듈의 기능이나 변수 등에 접근하기 위한 방법을 정의하는 것입니다. 인터페이스는 모듈을 사용하는 클라이언트와 모듈 개발자 사이의 계약으로 볼 수 있습니다. 인터페이스를 명확히 정의하면 모듈 간의 호환성 문제를 방지할 수 있습니다.

 

• 모듈의 독립성

모듈의 독립성을 높이기 위해서는 모듈 간의 상호 의존 정도를 나타내는 결합도는 낮추고 모듈이 독립적으로 자체 기능만을 수행하도록 응집도를 높여야 한다.

⇒ 결합도는 낮고 응집도가 높은 모듈로 설계하는 것이 좋다.

 

• 결합도(Coupling)

서로 다른 모듈 간에 상호 의존하는 정도

 

• 응집도(Cohesion)

한 모듈 내부의 처리 요소들이 서로 관련되어 있는 정도

 

• 자바스크립트 모듈

모든 자바스크립트 파일은 하나의 전역을 공유한다. 따라서 분리된 자바스크립트 파일들의 전역 변수가 중복되는 문제가 발생한다. 이것으로는 모듈을 구현할 수 없다.

⇒ 이런 상황에서 제안된 것이 모듈 시스템 CommonJS와 AMD이다.

 

• Babel

ES6+/ES.NEXT로 구현된 최신 사양의 소스코드를 IE 같은 구형브라우저에서도 동작하는 ES5 사양의 소스코드로 트랜스파일링할 수 있다.

 

• Babel만 사용할 경우 문제점

Babel이 모듈을 트랜스파일링한 것은 node.js가 기본 지원하는 CommonJS 방식의 모듈 로딩 시스템을 따른 것이다.

따라서 트랜스파일링한 결과물에서 CommonJS 방식의 require 함수는 브라우저에서 지원하지 않으므로 해당 결과를 브라우저에서 실행할 경우 에러가 발생한다.

브라우저의 ES6 모듈(ESM)을 사용하도록 Babel을 설정할 수 있으나 ESM을 사용하는 것은 위와 같이 문제가 있다.

이러한 문제를 Webpack이 해결해준다.

 

• Webpack

의존 관계에 있는 자바스크립트, CSS, 이미지 등의 리소스들을 하나(또는 여러 개)의 파일로 번들링하는 모듈 번들러이다.

⇒ Webpack을 사용하면 의존 모듈이 하나의 파일로 번들링되므로 별도의 모듈로더가 필요 없다.

⇒ 여러 개의 JS파일을 하나로 번들링하므로 HTML 파일에서 script 태그로 여러 개의 JS파일을 로드해야 하는 번거로움이 사라진다.

 

 

https://velog.io/@iamkjw/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EA%B8%B0%EC%88%A0%EB%A9%B4%EC%A0%91-11%ED%8E%B8

자바스크립트 기술면접 11편

 

https://contents.premium.naver.com/codetree/funcoding/contents/230226005842618vo

[NodeJS] 주요 특징 모듈 시스템 알아보기