노출 모듈 (Revealing Module) 패턴
[index]
1. 노출 모듈 (Revealing Module) 패턴이란?
2. 노출 모듈 (Revealing Module) 패턴의 장점
3. 노출 모듈 (Revealing Module) 패턴의 단점
4. 노출 모듈 (Revealing Module) 패턴 적용 예시
5. 마무리
+ 디자인 패턴이 무엇인지 모른다면?
https://reveur1996.tistory.com/149
1. 노출 모듈 (Revealing Module) 패턴이란?
노출 모듈 패턴(Revealing Module Pattern)은 자바스크립트에서 모듈을 생성하고 관리하는 디자인 패턴 중 하나입니다. 이 패턴은 객체와 함수를 활용하여 모듈을 구조화하고 필요한 부분만을 외부에 노출시키는 방식으로 동작합니다. 일반적인 모듈 패턴에서는 클로저와 함수 스코프를 이용하여 내부의 변수와 함수를 숨기고, 외부에 필요한 것만을 노출합니다. 노출 모듈 패턴은 이러한 아이디어를 발전시켜 모듈의 구조를 더 명시적으로 표현합니다.
노출 모듈 패턴은 코드를 모듈화하고 코드 간 결합도를 낮추는 데에 도움이 됩니다. 또한, 내부적인 상태와 동작을 숨기고 외부와의 명확한 인터페이스를 제공하여 코드를 더 쉽게 이해하고 유지보수할 수 있게 합니다.
노출 모듈 패턴의 구성 요소
- 즉시 실행 함수(IIFE)
노출 모듈 패턴은 즉시 실행 함수를 사용하여 모듈을 생성합니다. 이를 통해 모듈 내부의 변수와 함수들은 함수 스코프 내에 감춰져 외부에서 직접 접근할 수 없게 됩니다.
- 프라이빗 변수 및 함수
모듈 내부에서는 외부에서 직접 접근되지 않을 프라이빗 변수와 함수들이 정의됩니다. 이들은 모듈 내부에서만 사용되며 외부에서는 접근할 수 없습니다.
- 퍼블릭 변수 노출
모듈 외부에서 접근 가능한 변수를 명시적으로 지정하여 외부에 노출합니다. 이는 모듈의 인터페이스를 정의하며, 모듈 외부에서 사용 가능한 기능을 결정합니다.
2. 노출 모듈 (Revealing Module) 패턴의 장점
- 코드 응집성 향상
노출 모듈 패턴은 관련된 기능들을 함께 그룹화하여 노출함으로써 코드의 응집성을 향상시킵니다. 비슷한 목적을 가진 함수나 변수들을 하나의 모듈에 묶어두면 코드를 이해하기 쉽고 유지보수가 용이해집니다. - 정보 은닉
패턴을 사용하면 내부 변수와 함수를 외부에 노출할지 숨길지를 결정할 수 있습니다. 이는 객체의 상태를 숨기고 특정 함수만을 외부에 노출함으로써 모듈의 안정성을 높일 수 있습니다. - 명시적 API
외부에 명시적으로 노출되는 멤버를 통해 모듈의 공개 API를 명확하게 정의할 수 있습니다. 외부 코드 작성자는 어떤 기능을 사용할 수 있는지 명확하게 이해하고 사용할 수 있습니다. - 전역 네임스페이스 오염 방지
노출 모듈 패턴은 전역 스코프에서의 변수 충돌을 방지하고 전역 네임스페이스를 깨끗하게 유지하는 데 도움이 됩니다. 모듈 내부에서 정의한 변수와 함수는 외부에서 직접 접근할 수 없으므로, 중복된 이름의 전역 변수나 함수로 인한 충돌을 최소화할 수 있습니다. - 유연성과 확장성
노출 모듈 패턴은 모듈 내부의 구현을 변경하더라도 외부 인터페이스를 그대로 유지할 수 있습니다. 이는 모듈의 구현을 수정하더라도 클라이언트 코드를 변경하지 않고도 호환성을 유지할 수 있게 합니다. - 테스트 용이성
노출 모듈 패턴을 사용하면 모듈의 내부 상태와 동작을 캡슐화하고, 외부에는 필요한 기능만을 노출하기 때문에 모듈의 단위 테스트가 더 쉬워집니다.
3. 노출 모듈 (Revealing Module) 패턴의 단점
- 캡슐화 부족
노출 모듈 패턴은 정보 은닉을 지원하지만, 완전한 캡슐화를 제공하지는 않습니다. 모듈 내부의 프라이빗 멤버들은 여전히 외부에서 직접 접근할 수 없지만, 이를 우회하고 접근할 수 있는 방법이 있을 수 있습니다. - 동적 변경 어려움
노출 모듈 패턴에서는 모듈 내의 메서드를 동적으로 변경하기 어렵습니다. 한 번 노출된 메서드의 구현을 동적으로 수정하거나 교체하기 어렵기 때문에 확장성이나 동적인 요구사항에 제한이 있을 수 있습니다. - 네이밍 충돌 가능성
노출 모듈 패턴을 사용하면 외부에 명시적으로 노출되는 멤버들의 이름이 중요합니다. 만약 두 모듈에서 같은 이름을 사용하면 네이밍 충돌이 발생할 수 있습니다. - 객체 인스턴스 생성 어려움
노출 모듈 패턴을 사용하면 객체 인스턴스 생성이 어려울 수 있습니다. 보통 즉시 실행 함수로 모듈을 생성하기 때문에, 여러 인스턴스를 생성하거나 상속을 통한 확장이 번거로울 수 있습니다. - 모듈 간 종속성
각 모듈이 다른 모듈의 내부 구현에 의존하는 경우, 이는 모듈 간의 결합도를 증가시킬 수 있습니다. 이는 모듈의 재사용성과 독립성을 감소시킬 수 있습니다. - 가독성 감소
명시적으로 노출할 메서드를 return 문에 나열해야 하기 때문에 코드의 길이가 늘어나고, 이는 가독성을 감소시킬 수 있습니다. 특히 노출되는 멤버가 많을수록 코드의 명시성이 떨어질 수 있습니다.
4. 노출 모듈 (Revealing Module) 패턴 적용 예시
// 사용자 정보 모듈
let UserModule = (function() {
let username = "";
let age = 0;
function setUserInfo(name, userAge) {
username = name;
age = userAge;
}
function getUserInfo() {
return "Username: " + username + ", Age: " + age;
}
// 외부에 노출되는 인터페이스
return {
setUserInfo: setUserInfo,
getUserInfo: getUserInfo
};
})();
// 메시지 출력 모듈
let MessageModule = (function() {
function showMessage(message) {
console.log("Message: " + message);
}
// 외부에 노출되는 인터페이스
return {
showMessage: showMessage
};
})();
// 사용자 정보 설정
UserModule.setUserInfo("John Doe", 25);
// 사용자 정보 출력
let userInfo = UserModule.getUserInfo();
MessageModule.showMessage(userInfo);
이 예시에서는 UserModule과 MessageModule이라는 두 개의 모듈을 생성합니다. UserModule은 사용자 정보를 설정하고 가져오는 기능을 제공하며, MessageModule은 메시지를 콘솔에 출력하는 기능을 제공합니다. 각 모듈은 즉시 실행 함수로 감싸져 있고, 외부에 노출할 메서드만을 명시적으로 노출하고 있습니다.
5. 마무리
노출 모듈 패턴은 자바스크립트에서 모듈화된 코드를 구현하는 데에 유용한 디자인 패턴 중 하나입니다. 이 패턴은 코드의 응집성을 높이고 유지보수성을 향상시키는 데에 기여하며, 모듈 간의 결합도를 낮춰서 코드를 더욱 확장 가능하고 유연하게 만들어줍니다. 노출 모듈 패턴은 캡슐화를 통해 내부 상태와 동작을 보호하면서, 외부에 명시적으로 노출되는 인터페이스를 정의합니다. 이를 통해 사용자는 모듈의 기능을 명확하게 이해하고, 필요한 기능만을 사용할 수 있습니다. 또한, 각 모듈은 독립적으로 작동하므로 모듈 간의 상호작용이 명확하게 구분되어 코드를 이해하고 관리하는 데에 도움이 됩니다.
그러나 노출 모듈 패턴을 적용할 때에는 캡슐화의 한계와 명시적 노출 멤버의 네이밍 충돌 등을 고려해야 합니다. 또한, 동적 변경이 어려운 점과 캡슐화가 완벽하지 않아 정보 은닉이 보장되지 않는 점도 주의해야 합니다.
마지막으로, 노출 모듈 패턴은 모듈화된 코드를 작성하고자 할 때 유용한 도구 중 하나이며, 프로젝트의 특성과 목적에 맞게 적절히 활용하는 것이 중요합니다. 이를 통해 코드의 유지보수성을 높이고, 확장성을 강화하여 더 효율적이고 견고한 소프트웨어를 개발할 수 있을 것입니다.
참고문헌
https://medium.com/@sanderdebr/revealing-module-pattern-in-javascript-d62299add76b
https://www.geeksforgeeks.org/describe-the-revealing-module-pattern-in-javascript/
https://www.oreilly.com/library/view/learning-javascript-design/9781449334840/ch09s03.html
https://www.telerik.com/blogs/how-module-pattern-works-javascript
https://gist.github.com/zcaceres/bb0eec99c02dda6aac0e041d0d4d7bf2
https://edykim.com/ko/post/revealing-module-pattern/
https://medium.com/@Rahulx1/revealing-module-pattern-tips-e3442d4e352
'Web Development > Design Patterns' 카테고리의 다른 글
[Design Patterns] MVC Pattern, MVP Pattern, MVVM Pattern (1) | 2023.12.12 |
---|---|
[Design Patterns] 행위 패턴(Behavioral Patterns) | 반복자 (Iterator) 패턴 (0) | 2023.12.12 |
[Design Patterns] 구조 패턴(Structural Patterns) | 프록시 (Proxy) 패턴 (0) | 2023.12.12 |
[Design Patterns] 행위 패턴(Behavioral Patterns) | 옵저버(Observer) 패턴 (0) | 2023.12.12 |
[Design Patterns] 행위 패턴(Behavioral Patterns) | 전략 (Strategy) 패턴. (0) | 2023.12.12 |