JS 디자인 모델--11.어댑터 모드

5124 단어 어댑터 모드

어댑터 모드 개요


어댑터 모드는 기존 인터페이스와 호환되지 않는 클래스 사이의 어댑터에 사용할 수 있습니다.이런 모델을 사용하는 대상을 포장기(wrapper)라고도 부른다.

어댑터 특징


겉으로 보기에 어댑터 모드는 문면 모드와 매우 비슷하다.이들은 다른 대상을 포장하고 인터페이스를 바꿔야 한다.
양자의 차이는 그들이 어떻게 인터페이스를 바꾸는가에 있다.
4
  • 외관 요소는 간략한 인터페이스를 보여준다. 그녀는 별도의 선택을 제공하지 않고 때로는 임무를 완성하기 편리하도록 가정을 하기도 한다

  • 4
  • 어댑터는 한 인터페이스를 다른 인터페이스로 바꾸려고 한다. 그녀는 어떤 능력을 필터하지 않고 인터페이스를 간소화하지 않는다

  • 객체가 하나 있고 세 문자열을 매개변수로 하는 함수가 하나 더 있다고 가정합니다.
    var clientObject = {
    
        string1: 'foo',
    
        string1: 'bar',
    
        string1: 'baz'
    
    };
    
    function interfaceMethod(str1, str2, str3){
    
        console.log('ehhe');
    
    }

    clientObject를 매개 변수로interfaceMethod에 전달하기 위해서는 어댑터가 필요합니다.다음과 같습니다.
    function clientToInterfaceAdapter(o){// 
    
        interfaceMethod(o.string1, o.string2, o.string3);
    
    }

    예: 두 라이브러리 모두 적합


    다음은Prototype 라이브러리의 $함수에서 YUI의 get 방법으로 변환합니다.이 두 함수의 기능은 비교적 비슷하지만 먼저 그녀들의 인터페이스 방면의 차이를 살펴보자.
    function $(){
    
        var elments = new Array();
    
        for(var i=0; i<arguments.length; i++){
    
            var element = arguments[i];
    
            if(typeof element == 'string'){
    
                element = document.getElementById(element);
    
            }
    
            if(arguments.length == 1){
    
                return element;
    
            }
    
            elments.push(element);
    
        }
    
        return elements;
    
    }
    
    YAHOO.util.Dom.get = function(el){
    
        if(YAHOO.lang.isString(el)){
    
            return document.getElementById(el);
    
        }
    
        if(YAHOO.lang.isArray(el)){
    
            var c = [];
    
            for(var i= 0, len=el.length; i<len; i++){
    
                c[c.length] = YAHOO.util.Dom.get(el[i]);
    
            }
    
            return c;
    
        }
    
        if(el){
    
            return el;
    
        }
    
        return null;
    
    }

    양자의 차이는 다음과 같다. get은 하나의 매개 변수를 가지고 있다. 이 매개 변수는 HTML 요소, 문자열 또는 문자열 또는 HTML 요소로 구성된 그룹이 될 수 있다. 이와 달리 $함수는 정식으로 매개 변수를 열거하지 않고 사용자가 임의의 매개 변수를 전송할 수 있도록 허용한다. 문자열이든 HTML 요소든 상관없다.
    $방법에서 get 방법으로 전환하려면 (또는 반대로) 이 용도에 사용되는 어댑터는 어떻게 됩니까?
    function $2getAdapter(){
    
        return YAHOO.util.Dom.get(arguments);
    
    }
    
    function get2$Adapter(el){
    
        return $.apply(window, el instanceof Array ?el: [el]);
    
    }

    Prototype에서 YUI로 바뀐 사람은 다음과 같이 사용해야 한다.
    $ = $2getAdapter;

    대신 다음과 같이 사용합니다.
    YAHOO.util.Dom.get = get2$Adapter;

    어댑터 모드의 사용 장소


    어댑터는 고객 시스템이 기대하는 인터페이스와 기존 API에서 제공하는 인터페이스가 호환되지 않습니다.그녀는 문법상의 차이 문제를 조율하는 데만 쓸 수 있다.어댑터가 어울리는 두 가지 방법은 유사한 임무를 수행해야 한다. 그렇지 않으면 그녀는 문제를 해결할 수 없다.

    어댑터 모드의 이점


    어댑터 모델은 기존의 고객 코드를 대규모로 바꾸는 것을 피하는 데 유리하다.

    어댑터 모드의 폐해


    만약 기존의 API가 아직 정형화되지 않았거나, 새 길목이 아직 정형화되지 않았다면, 어댑터는 계속 사용되지 않을 것이다.

    좋은 웹페이지 즐겨찾기