[JavaScript] 모듈

---

---

모듈이란?

 

프로그램은 코드의 재활용성, 유지보수를 쉽게 할 수 있는 다양한 기법들이 사용된다. 

대표적으로 하나의 코드를 여러개의 파일로 분리하는 것이다. 

• 자주 사용되는 코드를 별도의 파일로 만들어서 재활용할 수 있다.
• 코드를 개선하면 이를 사용하는 모든 애플리케이션의 동작이 개선된다.
• 코드 수정시 필요한 로직을 빠르게 찾을 수 있다.
• 메모리의 낭비를 줄일 수 있다.
• 한번 다운로드된 모듈은 웹브라우저에 의해 저장이 되기 때문에 로직을 로드 할 때 시간과 네트웤 트래픽을 절약할 수 있다.(브라우저에서만 해당)

 

호스트환경

 

호스트 환경의 개념을 알아야 우리는 모듈을 이해할 수 있다.

왜냐하면 자바스크립트에서는 모듈이라는 개념이 존재하지 않는다.

자바스크립트가 구동되는 호스트 환경에 따라 각기 다른 모듈화 방법이 제공되기 때문이다.

무슨 의미냐면 자바스크립트는 브라우저를 위한 언어로 시작했지만 더이상 브라우저만을 위한 언어가 아니다.

자바스크립트의 문법을 따르지만 언어가 구동되는 환경은 서버측 환경이고,

PHP와 같은 서버 시스템을 제어(node.js.) 또는 구글의 제품(Google Apps Script)를 제어 할 수 있다. 

즉, 언어와 그 언어가 구동되는 환경을 호스트 환경이라 하고 우리는 이를 구분할 줄 알아야 한다.

 

모듈의 사용

 

모듈

 

만약 welcome이라는 함수가 자주 사용되는 것이라면 필요할 때마다 이 함수를 정의하고 사용하는 것은

유지보수도 어렵고 낭비가 된다. 

이럴때 '모듈'이 필요하다.

 

js.js가 모듈

 

Script 태그

 

html과 자바스크립트는 완전히 다른 언어이기에 알려줘야한다.

이때 사용하는 html태그가 Script태그이다.

<script src = " js.js"></script>를 헤드에 입력하면서 자바의 위치를 알려줘야한다. 

이렇게 js.js라는 자바스크립트에 welcome 함수 모듈을 만들고

html에서는 welcome 함수를 가독성 좋게 사용했다.

 js.js에 welcome 함수가 정의되어 있기 때문에 html에서는 함수가 정의 되어 있지 않음에도 실행이 되는 것이다.