본문 바로가기
javascript pure/javascript 코어 개념

21. 디자인 패턴(Design Patterns) - 3

by leo2114 2024. 2. 16.
반응형

모듈(Module) 패턴과 중재자(Mediator) 패턴

모듈(Module) 패턴

모듈 패턴은 JavaScript에서 모듈화를 구현하기 위한 디자인 패턴 중 하나입니다. 이 패턴은 코드를 여러 파일로 분리하여 관리하고 모듈 간의 의존성을 줄이는 데 사용됩니다. 주로 캡슐화와 정보 은닉을 통해 코드의 유지보수성을 향상시키는 데 활용됩니다.

 

핵심 내용:

  • 모듈 패턴은 즉시 실행 함수 표현식(IIFE)을 사용하여 모듈을 생성합니다.
  • 내부 변수와 함수는 외부에서 접근할 수 없도록 캡슐화되며 필요한 경우 공개 인터페이스를 통해 외부에 노출됩니다.
  • 모듈 간의 의존성을 최소화하기 위해 단일 책임 원칙을 따르며, 각 모듈은 특정 기능 또는 역할을 수행합니다.

예시:

var Module = (function() {
    // private variable
    var privateVar = 'I am private';

    // private function
    function privateFunction() {
        console.log('This is private function');
    }

    // public interface
    return {
        publicVar: 'I am public',
        publicFunction: function() {
            console.log('This is public function');
        }
    };
})();

console.log(Module.publicVar); // Output: I am public
Module.publicFunction(); // Output: This is public function
console.log(Module.privateVar); // Output: undefined
Module.privateFunction(); // Output: TypeError: Module.privateFunction is not a function

중재자(Mediator) 패턴

중재자 패턴은 객체 간의 상호 작용을 캡슐화하여 객체 간의 결합을 줄이는 데 사용되는 디자인 패턴입니다. 이 패턴은 객체 간의 직접적인 통신을 방지하고 대신 중재자 객체를 통해 통신을 조정하여 시스템의 유연성과 확장성을 향상시킵니다.

 

핵심 내용:

  • 중재자 객체는 시스템의 모든 객체와 통신하며, 각 객체는 중재자 객체를 통해 다른 객체와 상호 작용합니다.
  • 객체 간의 결합을 줄이고 유연성을 향상시키는 데 도움이 됩니다. 새로운 객체를 추가하거나 기존 객체를 변경할 때 다른 객체에 영향을 최소화할 수 있습니다.
  • 중재자 패턴은 특히 복잡한 상호 작용을 관리하는 데 유용하며, 이벤트 기반 시스템에서 종종 사용됩니다.

예시:

// Mediator
class Mediator {
    constructor() {
        this.colleagues = [];
    }

    addColleague(colleague) {
        this.colleagues.push(colleague);
    }

    send(message, sender) {
        this.colleagues.forEach(colleague => {
            if (colleague !== sender) {
                colleague.receive(message);
            }
        });
    }
}

// Colleague
class Colleague {
    constructor(mediator) {
        this.mediator = mediator;
    }

    send(message) {
        this.mediator.send(message, this);
    }

    receive(message) {
        console.log('Received message:', message);
    }
}

// Usage
const mediator = new Mediator();
const colleague1 = new Colleague(mediator);
const colleague2 = new Colleague(mediator);

mediator.addColleague(colleague1);
mediator.addColleague(colleague2);

colleague1.send('Hello from colleague 1');
colleague2.send('Hi from colleague 2');

 

모듈 패턴과 중재자 패턴은 각각 코드의 모듈화와 객체 간의 통신을 관리하는 데 유용한 패턴입니다. 이러한 패턴을 적절하게 활용하여 코드를 구조화하고 유지보수성을 향상시킬 수 있습니다.

반응형