퍼사드 패턴_JavaScript 디자인 패턴8

一.퍼사드 패턴

하위층 컴포넌트 인터페이스를 이차 캡슐화 (삼수, 사수의 것도 이수로 간주) 하여, 더 사용하기 쉬운 고층 인터페이스�� 제공하는 것이 퍼사드 패턴의 핵심 사상입니다.

퍼사드 (외관) 라고 하면, 쉽게 화장을 연상하게 되지만, 여기서는 예쁘게 보이기 위한 것이 아니라, 단순히 사용하기 좋기 위한 것입니다.

二.구체적인 구현

var mod1 = {
    fun1: function() {
        // ...
    },
    fun2: function() {
        // ...
    }
    // ...
}
var mod2 = {
    fun1: function() {
        // ...
    },
    fun2: function() {
        // ...
    }
    // ...
}
// ...

// facade
var facade = {
    c: true,

    newFun1: function() {
        mod1.fun2();
        if (this.c) {
            mod1.fun1();
        }
        // ...
    },
    newFun2: function() {
        mod2.fun1();
        mod2.fun2();
        mod1.fun1();
        if (this.c) {
            mod1.fun2();
        }
        // ...
    }
    // ...
}

// invoke facade
facade.newFun1();
// invoke mods
// mod1.fun2();
// if (c) {
//     mod1.fun1();
// }
// ...

하위층 모듈의 인터페이스를 더욱 추상화하여, 간단하고 사용하기 쉬운 퍼사드를 캡슐화합니다. 캡슐화에는 끝이 없으며, 모듈 내부에서 모듈 간, 서브시스템 간, 그리고 시스템 자체까지, 계속하고 싶으면 n 층의 캡슐화를 추가할 수 있습니다. 심지어 퍼사드 패턴을 사용하여 메서드 이름이 너무 긴 문제를 해결할 수도 있습니다. 예를 들어:

var d = {
    byId: function(strId) {
        return document.getElementById(strId);
    },
    byClass: function(strClass) {
        return document.getElementsByClassName(strClass);
    },
    byTag: function(strTag) {
        return document.getElementsByName(strTag);
    }
    // ...
}

// test
d.byId('test').innerHTML = 'test facade';

三.퍼사드 패턴의 장단점

장점

서적에 비교적 적절한 말이 있습니다:

구현 세부사항에 주목할 필요가 없고, moreover 사용하기 쉽다

단점

다층 캡슐화는 긴 호출 체인을 의미하며, 성능 비용이 존재합니다. 성능 요구가 매우 높은 경우, 당연히 캡슐화 층수는 적을수록 좋고, 하위층에 가까울수록 실행 효율은 높아집니다. 퍼사드 패턴을 사용할 때는, 이차 캡슐화의 가치가 있는지 (성능 비용이 허용 가능한지) 를 고려해야 할 수 있습니다

JQuery 의$가 네이티브 JS 구현보다 얼마나 느린지에 대해, 답은：실제로 당신이 상상하는ほど 느리지 않습니다

퍼사드 패턴에 대한 상세 정보는, 黯羽轻扬：디자인 패턴之 퍼사드 패턴（Facade Pattern） 를 참조하십시오

참고 자료

• 『JavaScript 디자인 패턴』