반응형
Module Pattern(모듈 패턴) 은 변수나 함수를 외부에 노출하지 않고, 캡슐화(encapsulation) 를 통해 내부 구현을 숨길 수 있도록 하는 디자인 패턴입니다. 전역 네임스페이스 오염을 방지하고, 코드를 구조화하는 데 매우 유용합니다.
🧱 Module Pattern이란?
Module Pattern은 즉시 실행 함수(IIFE) 와 클로저를 활용하여 프라이빗(private) 데이터와 퍼블릭(public) API를 명확히 분리합니다. 이를 통해 외부에서 접근 가능한 인터페이스만 공개하고, 나머지는 내부에서만 사용할 수 있게 만듭니다.
const CounterModule = (function () {
let count = 0;
function changeBy(val) {
count += val;
}
return {
increment() {
changeBy(1);
},
decrement() {
changeBy(-1);
},
getCount() {
return count;
}
};
})();
CounterModule.increment();
CounterModule.increment();
console.log(CounterModule.getCount()); // 2
✅ 장점
- 정보 은닉: 외부에서는 내부 상태(count 등)에 직접 접근할 수 없음
- 전역 변수 최소화: 네임스페이스 오염을 방지하고 충돌 가능성 감소
- 구조화된 코드: 명확한 인터페이스 제공으로 유지보수가 쉬움
❌ 단점
- 테스트 어려움: 내부 구현이 숨겨져 있어 테스트하기 힘들 수 있음
- 상속 어려움: 다른 모듈에서 해당 모듈의 기능을 상속받기 어려움
- 메모리 점유: 클로저를 통해 유지되는 상태는 메모리 해제가 어렵기도 함
🛠️ 실전 예시: 설정 모듈
const ConfigModule = (function () {
const config = {
apiKey: '123-ABC',
apiUrl: 'https://api.example.com'
};
return {
get(key) {
return config[key];
},
set(key, value) {
config[key] = value;
}
};
})();
console.log(ConfigModule.get('apiUrl'));
ConfigModule.set('apiUrl', 'https://api.newdomain.com');
console.log(ConfigModule.get('apiUrl'));
🧩 결론
Module Pattern은 특히 ES6 이전의 자바스크립트에서 널리 사용되던 캡슐화 기법입니다. 지금은 ES6 모듈(import/export)이 표준이 되었지만, 여전히 클로저 기반의 모듈 패턴은 강력한 정보 은닉 수단으로 활용됩니다. 코드의 안정성과 유지보수성 향상을 위해 모듈화를 고려해야 합니다.
반응형
'Programing > javascript' 카테고리의 다른 글
자바스크립트 Adapter Pattern (0) | 2025.04.19 |
---|---|
자바스크립트 Proxy Pattern (0) | 2025.04.19 |
자바스크립트 Facade Pattern (0) | 2025.04.19 |
자바스크립트 Decorator Pattern (0) | 2025.04.19 |
자바스크립트 Builder Pattern (0) | 2025.04.19 |
자바스크립트 Prototype Pattern (1) | 2025.04.19 |
자바스크립트 Singleton Pattern (0) | 2025.04.19 |
자바스크립트 Factory Pattern (0) | 2025.04.19 |