모듈이란 애플리케이션을 구성하는 개별적 요소( class )로서 재사용 가능한 코드 조각(파일로 분리)을 말한다.
모듈은 세부 사항을 캡슐화하고 공개가 필요한 API만을 외부에 노출한다.
일반적으로 모듈은 파일 단위로 분리되어 있으며 애플리케이션은 필요에 따라 명시적으로 모듈을 로드하여( import ) 재사용한다.
그냥 컴퍼넌화해서 사용하면 파일간에 변수명이 겹쳐 오류가 날 수 있다.
모듈화해서 사용하면 모듈안에서 사용한 변수는 더이상 전역변수가 아니며 window 객체의 프로퍼티도 아니다.
모듈안에서만 사용되는 변수이다.
<script type="module" src="./js/music.mjs"></script>
export로 내보내고 import로 받기
import안에 그냥 써도 되는데 이름을 바꿔 저장하고싶을때는 as를 사용한다.
const pi = Math.PI;
function square(x){
return x * x;
}
class Person {
constructor(name){
this.name = name;
}
}
export {pi, square, Person};
import {pi as PI, square as sq, Person as P} from './a.mjs';
console.log(PI);
console.log(sq(10));
console.log(new P('Lee'));
시스템이 원래 가지고있던게 내장모듈, 내가 새로 만든게 사용자 모듈
반응형
'JAVASCRIPT' 카테고리의 다른 글
JAVASCRIPT ) 이터레이션과 for of문 (0) | 2024.08.09 |
---|---|
JAVASCRIPT ) 심볼 (0) | 2024.08.09 |
JAVASCRIPT ) canvas에 방정식 그래프 그리기 (0) | 2024.08.08 |
JAVASCRIPT ) 객체 delete (0) | 2024.08.06 |
JAVASCRIPT ) canvas로 데이터 시각화 (0) | 2024.08.02 |